function-level scope
跟Java等编程语言不同,JavaScript的作用域是function-level scope的,即只有function才能限定作用域,花括号{}
并没有什么卵用。如下,if语句外部的打印语句,依然会输出2:
var x = 1;
console.log(x); // 1
if (true) {
var x = 2;
console.log(x); // 2
}
console.log(x); // 2
作用域提升
依然跟Java有很大不同,JavaScript的作用域可以提升,即在同一个作用域内,不管在任何地方定义的变量,在js解释器编译时,所有的变量都会提升到作用域的顶端。作用域提升分为两种,一种是变量的作用域提升,另一种是函数的作用域提升。
一、变量的作用域提升
变量被提升,是指JavaScript在解析JavaScript代码时,会将所有的变量声明提升到作用域的顶端。
function foo() {
console.log(tmp);
if (true) {
var tmp = 3;
}
}
foo();
运行上面的代码不会报这个错误Uncaught ReferenceError: tmp is not defined
,因为变量被提升了,以上代码实际上被解释器解释成如下:
function foo() {
var tmp;
console.log(tmp);
if (true) {
tmp = 3;
}
}
foo();
二、函数的作用域提升
函数同样会被提升,但是函数的提升有一些不同。函数的声明方式有两种:
一种是声明式,如:function fun1(){};
另一种是变量式,如:var fun2 = function () {};
上面两种方式的作用域提升是不一样的,如执行下面的代码:
代码:
function fun(){
fun1();
fun2();
var fun2 = function(){
console.log("fun2执行!");
}
function fun1(){
console.log("fun1执行!");
}
}
fun();
运行结果是这样的:
为什么会这样呢?
因为,声明式会自动将声明放在前面并且执行赋值过程;而变量式则是先将声明提升,然后到赋值处再执行赋值,所以,上面的代码会被解释成如下:
function fun(){
var fun2;
function fun1(){
console.log("fun1执行!");
}
fun1();
fun2();
fun2 = function(){
console.log("fun2执行!");
}
}
fun();
以上是本博客的全部内容了,如有错误之处,还请留言指正。