一个例子，教你明白变量提升和函数提升

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/sinat_41695090/article/details/81284355

首先来段总结：

引擎在读取js代码的过程中，分为两步。第一个步骤是整个js代码的解析读取，第二个步骤是执行。 

在读取代码的过程中，就产生了将所有声明提升到顶端，然后再从上往下执行。由此产生了变量提升和函数提升。

1.变量提升只会提升变量名的声明，而不会提升变量的赋值初始化。

2.函数提升的优先级大于变量提升的优先级，即函数提升在变量提升之上。

记住这两句话，就可以从容不迫的撸代码了！

console.log(foo);
foo();//可以执行
var foo=10;
foo();//foo已经被赋值为一个变量，无法执行foo为函数
console.log(foo); 
function foo(){
  var a;
  console.log(a);
  a=12;
  console.log(a);
}
console.log(foo);

猜猜输出什么？

实际的执行顺序

function foo(){
  var a;
  console.log(a);
  a=12;
  console.log(a);
}
var foo;
console.log(foo);
foo();
foo=10;
foo();//由于这里报错，foo已经被赋值，找不到这个函数，下面的都不会被执行
console.log(foo);
console.log(foo);

明白了吗？

还有几个小例子总结：

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

输出结果是：报错！

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

输出结果是啥呢？ 1

 function foo(){
 console.log(x);
 }
 foo();
 var x=1;//undefined

输出结果：undefined

console.log(f1()); 
console.log(f2);   
function f1(){console.log('aa')};
var f2 = function() {};

输出结果依次是：aa,undefined,undefined