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.上下文栈

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