函数提升和变量提升实例

-版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
-本文链接：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);

-猜猜输出什么？

image.png

-实际的执行顺序

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(){
  console.log(x);
}
foo();
var x=1;     //undefined

-输出结果：undefined

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

-输出结果：报错！

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

-输出结果：1

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

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