JavaScript的声明提升

1. 执行顺序

a = 3;
var a;
console.log(a);//3

可能有人会疑问,问什么是3而不是undefined呢？,原因是var 声明的变量会提前到当前作用域的顶部去声明,并给变量默认赋值为undefined。

var a;
a = 3;
console.log(a);

实际的执行顺序是这样的。

2. 编译器

console.log( a );
var a = 2;

经过刚才的例子你可能会认为打印的是一个2或者报错,实际上打印的还是undefined。

因为浏览器解析到这个var关键字后,先到代码执行的最前面给他赋值为undefined,然后再给它赋值。

函数也有变量提示,不过仅限于直接通过function声明的具名函数,函数表达式则不会被提升,那怕他是一个具名函数。

foo(); // TypeError
bar(); // ReferenceError
var foo = function bar() {
};

1. 首先解析到了var，在当前作用域的顶部进行了var foo;

2. 然后去调用到了foo,此时foo为undefined所以我们通过()去调用,会告诉我们类型错误。

3. 调用bar,此时函数bar没有变量提升，此时调用函数首先执行RHS查询，查询不到直接报错。

4. 至于给foo赋值为函数,会直接无视掉这个函数的具名,不去变量提升。

3. 函数声明优先

函数声明和变量声明同时存在的时候会先去声明函数,然后再声明变量。

var bar
function bar(){
 console.log(1);
}
bar()//1

1. 首先浏览器解析到了function声明了bar,首先执行它。

2. 然后解析到了bar,又通过RHS查询,发现这个变量被function声明过了,直接跳过var声名。

3. 然后调用了bar()

需要注意的是后面声明的同名函数会去覆盖掉前面的。

4. 小结

1. 关键字function和var声明的变量都会存在变量提升,提前到当前作用域的顶部去进行声明。

2. 二者同时出现时,先执行function的声明,在执行var的声明。