var关于变量提升

转载来自：

作者：颠倒的黑白
链接：https://www.jianshu.com/p/184cb2075d16
来源：简书

jsx

var a;
console.log(a === undefined);
a=10;
function foo() {
  console.log([a,i]);
  var a=20;
  for(var i=0;i<a;i++) {
    //do
  }
  console.log([a,i])
}
foo();

输出结果

csharp

1
2
3

true
[undefined, undefined]
[20, 20]

JavaScript引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。这造成的结果，就是所有的变量的声明语句，都会被提升到代码的头部，这就叫做变量提升（hoisting）。

例子

jsx

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

以上语句并不会报错，只是提示undefined。实际运行过程：

jsx

1
2
3

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

表示变量a已声明，但还未赋值。但是变量提升只对var命令声明的变量有效，如果一个变量不是用var命令声明的，就不会发生变量提升。

cpp

1 2	console.log(aa); aa =1;

以上代码将会报错:ReferenceError: aa is not defined.

与普通变量一样，js里的function也可看做变量，也存在变量提升情况：

jsx

a();

function a(){
    console.log(1);
};

表面上，上面代码好像在声明之前就调用了函数a。但是实际上，由于“变量提升”，函数a定义部分被提升到了代码头部，也就是在调用之前已经声明了。但是，如果采用赋值语句定义函数，JavaScript就会报错：

jsx

a();

var a = function(){
    console.log(1);
};

// TypeError: a is not a function

因为，实际运行过程：

jsx

var a;
a();
a = function(){
    console.log(1);
};

这时候a是个变量，并非function。