JavaScript 变量提高详解

要点

1. 引擎会 在解释 JavaScript 代码以前首先对其进行编译。
2. 编译阶段中的一部分工做就是找到全部的 声明，并用合适的做用域将它们关联起来。也正是词法做用域 的核心内容。
3. ReferenceError 同做用域判别失败相关，而 TypeError 则表明做用域判别成功了，可是对 结果的操做是非法或不合理的。
4. var a = 2提高的是var a;而不会提高赋值操做 a=2，赋值操做将原地保留;

所以，正确的思考思路是

1. 包括变量和函数在内的全部声明都会在任何代码被执行前首先 被处理。
2. 当你看到var a =2;时，可能会认为这是一个声明。但JavaScript实际上会将其当作两个 声明:

var a;
 a =2;
复制代码

3. 第一个定义声明是在编译阶段进行的。第二个赋值声明会被留在 原地等待执行阶段。

例子1

a = 2;
var a;
console.log( a );//输出2
复制代码

由于：

var a;
a = 2; 
console.log( a ); // 2
复制代码

例子2

console.log( a );
var a = 2; //输出undefined
复制代码

由于

var a; 
console.log( a );
a = 2;
复制代码

例子3

foo();
function foo() {
    console.log( a ); // undefined 
    var a = 2;
}
复制代码

foo 函数的声明(这个例子还包括实际函数的隐含值)被提高了，所以第一行中的调用能够正常执行。 foo 是函数声明，函数声明会被提高，可是函数表达式却不会被提高。看下面例子4；

例子4

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

复制代码

由于

1. 这段程序中的变量标识符foo()被提高
2. 分配给所在做用域(在这里是全局做用域)
3. 所以 foo() 不会致使 ReferenceError
4. 可是 foo 此时并无赋值;(若是它是一个函数声明而不 是函数表达式，那么就会赋值)
5. foo() 因为对 undefined 值进行函数调用而致使非法操做， 所以抛出 TypeError 异常

因此上面代码等同于：

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

复制代码

优先级

后面的函数声明 > 函数声明 > 变量声明

foo(); // 1
var foo;
function foo() {
    console.log( 1 );
}
foo = function() { 
    console.log( 2 );
};
复制代码

会输出 1 而不是 2 ! 等同于

function foo() { 
    console.log( 1 );
}
foo(); // 1
foo = function() { 
    console.log( 2 );
};
复制代码

总结

要注意避免重复声明，特别是当普通的 var 声明和函数声明混合在一块儿的时候，不然会引 起不少危险的问题!