JS变量提升和作用域

一.JS变量提升

1.当浏览器引擎解析js代码时，将js中的所有一开始就是var声明的和function声明的都提升到全局。此时又叫全局作用域

   console.log(aa);
   console.log(ff);
   console.log(bb);

   var aa = "aa";

   function ff(){
     console.log("ff");
   }

注意：undefined和is not defined是不一样的。

• undefined：声明了该变量但是调用时没有定义值

• is not defined：没有声明也没有定义值

2.对于函数也一样，又叫做局部作用域

   function ff(){

     console.log(aa);
     console.log(fun);
     console.log(bb);
     var aa = "aa";
     function fun(){}

   }

   ff();

3.作用域分类

• 全局作用域

• 函数作用域

• 块作用域（ES6才有）

注：查找作用域先从当前作用域查找再找上层作用域

例1：

   var x = 10;
   function fn() {
     console.log(x);
   }
   function show(f) {
     var x = 20;
     f();
   }
   show(fn);   //10

分析：

• 全局作用域
  • var x
  • function fn
  • function show
• 函数作用域fn
• 函数作用域show
  • var x

注意此处两个函数作用域是同一级的

执行到console.log(x)时，会先看fn()的函数作用域内是否有x变量没有就出去看全局的（由于show和fn为同一级所以不会看show）,则此时x = 10;

例2：

   var fn = function () {
     console.log(fn)
   }
   fn()  

   var obj = {
     fn2: function () {
       console.log(fn2)
     }
   }
   obj.fn2()  

分析：

• 全局作用域：
  • var fn
  • var obj
• 全局中无函数作用域

第一个fn()：会执行console.log(fn)在函数中没有fn，找全局发现fn变量是一个函数则返回函数

第二个obj.fn2()：会执行console.log(fn2)在函数中没有发现fn2，不回去找obj对象中的fn2由于没有对象作用域这个东西，则找全局也没有找到报错了。

如果稍微修改以下将fn2改为this.fn2则不会报错，绑定调用对象obj然后调用obj的fn2。

   var fn = function () {
     console.log(fn)
   }
   fn()

   var obj = {
     fn2: function () {
       console.log(this.fn2)
     }
   }
   obj.fn2()

4.上下文栈

由于和其他语言的压栈方式相同则不在赘述