js作用域链

变量提升

JavaScript引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。这造成的结果，就是所有的变量的声明语句，都会被提升到代码的头部，这就叫做变量提升（hoisting）。

console.log(a);
var a = 1;   //最后的结果是显示undefined，表示变量a已声明，但还未赋值。

上面代码首先使用console.log方法，在控制台（console）显示变量a的值。这时变量a还没有声明和赋值，所以这是一种错误的做法，但是实际上不会报错，因为存在变量提升。

注意：变量提升只对var命令声明的变量有效，如果一个变量不是用var命令声明的，就不会发生变量提升。

console.log(b);
b = 1;  //语句报错，提示“ReferenceError: b is not defined”，即变量b未声明

这是因为b不是用var命令声明的，JavaScript引擎不会将其提升，而只是视为对顶层对象的b属性的赋值。

一、什么是作用域

JS中作用域有：全局作用域、函数作用域。

var x = 10 //x变量是属于全局作用域
function fn2() {
   var y = 9  //y变量是属于函数作用域2
   function fn1(){
      var z = 30  //z变量是属于函数作用域1
      console.log(x)
   }
}

一般来说，我们在查找x变量时，先在函数作用域1中查找，没有找到，再去函数作用域2中查找，没有找到，再去全局作用域中查找，这是一个由内向外查找的过程，即顺着一条链条从下往上查找变量，这种链条，我们就称之为作用域链。

二、根据题目深入理解作用域链

1. 第一题

var a = 1
function fn1(){
  function fn2(){
    console.log(a)
  }
  function fn3(){
    var a = 4
    fn2()
  }
  var a = 2
  return fn3
}
var fn = fn1()
fn()  //fn()输出为2

fn1()执行到最后是fn2(),fn2()内部没有定义变量，所以从当前函数所在的父容器的作用域去找，即f1()中查找，fn1()中a=2，所以输出为2。

2. 第二题

var a = 1
function fn1(){
  function fn3(){
    var a = 4
    fn2()
  }
  var a = 2
  return fn3
}
function fn2(){
  console.log(a)
}
var fn = fn1()
fn()  //fn()输出为1

执行fn1()后最终的调用函数为fn2()，而fn2()中没有定义a，所以从它所在的父容器的作用域寻找变量a，即全局作用域，全局变量a为1，所以结果输出为1.

3. 第三题

var a = 1
function fn1(){
  function fn3(){
    function fn2(){
      console.log(a)
    }
    var a
    fn2()
    a = 4
  }
  var a = 2
  return fn3
}
var fn = fn1()
fn()  //输出undefined

执行结果为fn2()，它内部没有定义a，所以从它父容器的作用域去寻找—即fn3()，因为a=4的赋值语句在fn2()后执行，所以此时a只是定义了还没有赋值，所以a为undefined。

解密

1. 函数在执行的过程中，先从自己内部找变量
2. 如果找不到，再从创建当前函数所在的作用域去找, 以此往上
3. 注意找的是变量的当前的状态