一.预解析概念

JS引擎在运行JS时通常分为两步，首先是预解析，然后执行代码

预解析分为**变量预解析和函数预解析。引擎会把JS里面所有的var和function**提升到当前作用域的最前面。
A 变量预解析：即变量提升，所谓变量提升就是把所有的变量声明提升到当前作用域的最前面。它只提升变量声明，不提升赋值。
例如 ：var num = 10; 就相当于

  1. var num;
  2. num =10;

B 函数预解析：即函数提升，所谓函数提升就是把所有函数声明提升到当前作用域的最前面，但不调用函数。

  1. fn();
  2. function fn(){
  3.     console.log(123);
  4. };
  5. //虽然调用方法写在了函数之前，但是根据函数预解析规则，函数会被提升到作用域最前面。
  6. //所以这段代码是可以正常输出结果的。

二.预解析案例

  1. var num = 10;
  2. fun();
  3. function fun(){
  4.     console.log(num);
  5.     var num = 20;
  6. }
  8. // 预解析分析
  9. var num;
  10. function fun(){
  11.     var num;
  12.     console.log(num);
  13.     num = 20;
  14. }
  15. num = 10;
  16. fun();
  17. // 输出结果为undefined


  1. var num = 10;
  2. function fn(){
  3.     console.log(num);
  4.     var num = 20;
  5.     console.log(num);
  6. }
  7. fn();
  9. // 预解析分析
  10. var num;
  11. function fn(){
  12.     var num;
  13.     console.log(num);
  14.     num = 20;
  15.     console.log(num);
  16. }
  17. num = 10;
  18. fn();
  19. // 输出结果为undefined和20
  1. var a = 18;
  2. f1();
  3. function f1(){
  4.     var b = 9;
  5.     console.log(a);
  6.     console.log(b);
  7.     var a = '123';
  8. }
  9. // 预解析分析
  10. var a;
  11. function f1(){
  12.     var b;
  13.     var a;
  14.     b = 9;
  15.     console.log(a);
  16.     console.log(b);
  17.     a = '123';
  18. };
  19. a = 18;
  20. f1();
  21. // 输出结果为undefined和9
  1. f1();
  2. console.log(c);
  3. console.log(b);
  4. console.log(a);
  5. function f1(){
  6.     var a = b = c =9;
  7.     console.log(a);
  8.     console.log(b);
  9.     console.log(c);
  10. }
  12. // 预解析分析
  13. function f1(){
  14.     var a; 
  15.     a = b = c =9; //相当于var = 9； b = 9; c = 9; b和c直接赋值，是全局变量
  16.     console.log(a);
  17.     console.log(b);
  18.     console.log(c);
  19. }
  20. f1();
  21. console.log(c);
  22. console.log(b);
  23. console.log(a);//报错
  24. // 输出结果为9，9，9，9，9和报错