欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

js变量的作用域、变量的提升、函数的提升

程序员文章站 2022-06-04 11:13:35
变量的作用域在函数之外声明的变量,叫做全局变量,因为它可被当前文档中的任何其他代码所访问。在函数内部声明的变量,叫做局部变量,因为它只能在当前函数的内部访问。 ECMAScript 6 之前的 JavaScript 没有 语句块作用域;相反,语句块中声明的变量将成为语句块所在函数(或全局作用域)的局 ......

变量的作用域
在函数之外声明的变量,叫做全局变量,因为它可被当前文档中的任何其他代码所访问。在函数内部声明的变量,叫做局部变量,因为它只能在当前函数的内部访问。

ecmascript 6 之前的 javascript 没有 语句块作用域;相反,语句块中声明的变量将成为语句块所在函数(或全局作用域)的局部变量。例如,如下的代码将在控制台输出 5,因为 x 的作用域是声明了 x 的那个函数(或全局范围),而不是 if 语句块。

if (true) {
var x = 5;
}
console.log(x); // 5
如果使用 ecmascript 6 中的 let 声明,上述行为将发生变化。

if (true) {
let y = 5;
}
console.log(y); // referenceerror: y 没有被声明
变量提升
javascript 变量的另一个不同寻常的地方是,你可以先使用变量稍后再声明变量而不会引发异常。这一概念称为变量提升;javascript 变量感觉上是被“提升”或移到了函数或语句的最前面。但是,提升后的变量将返回 undefined 值。因此在使用或引用某个变量之后进行声明和初始化操作,这个被提升的变量仍将返回 undefined 值。

/**
* 例子1
*/
console.log(x === undefined); // true
var x = 3;


/**
* 例子2
*/
// will return a value of undefined
var myvar = "my value";

(function() {
console.log(myvar); // undefined
var myvar = "local value";
})();
上面的例子,也可写作:

/**
* 例子1
*/
var x;
console.log(x === undefined); // true
x = 3;

/**
* 例子2
*/
var myvar = "my value";

(function() {
var myvar;
console.log(myvar); // undefined
myvar = "local value";
})();
由于存在变量提升,一个函数中所有的var语句应尽可能地放在接近函数顶部的地方。这个习惯将大大提升代码的清晰度。

在 ecmascript 6 中,let(const)将不会提升变量到代码块的顶部。因此,在变量声明之前引用这个变量,将抛出引用错误(referenceerror)。这个变量将从代码块一开始的时候就处在一个“暂时性死区”,直到这个变量被声明为止。

console.log(x); // referenceerror
let x = 3;
函数提升
对于函数来说,只有函数声明会被提升到顶部,而函数表达式不会被提升。

/* 函数声明 */

foo(); // "bar"

function foo() {
console.log("bar");
}


/* 函数表达式 */

baz(); // 类型错误:baz 不是一个函数

var baz = function() {
console.log("bar2");
};

 

本文引自:

https://developer.mozilla.org/zh-cn/docs/web/javascript/guide/grammar_and_types#unicode.e7.bc.96.e7.a0.81