【JS】作用域与作用域链

1. 词法(静态)作用域

首先，要先明确一点，JS属于【静态】作用域，即定义的时候决定变量是啥。
与之相对的是【动态】作用域，比如bash脚本和perl的一些模式。

var value = 1;
function foo(){
    console.log(value);
}
function bar(){
    var value = 2;
    foo()
}
bar();//结果是1，说明JS是静态的作用域

var value = 1;

function bar() {
  var value = 2;
  (function foo() {
    console.log(value);
  })();
}
bar();//2

2. 全局作用域

全局作用域下的内容，任何地方都能获取到

• 直接写在window或Global上面的对象和函数

  var globalVal = 'global value';
  

  function globalFn () {};
  

  window.length;//在当前窗口中frames的数量（包括IFRAMES）
  

• 非函数内的变量或函数提升（可以和另一篇记录一起看）
  • 变量提升

  if(false){
      var temp = 'blockVal';
  }
  console.log(temp);//undefined，说明能拿到，只不过是提升后的undefined
  

  • 函数提升

  if(false){
      function blockFn() {console.log('block function');}
  }
  console.log('函数为:', blockFn);//函数为: undefined
  console.log('函数类型为:', typeof blockFn);//函数类型为: undefined
  
  //等同于：
  
  var blockFn;
  if(false){
      blockFn = function blockFn() {console.log('block function');}
  }
  

3. 函数作用域

函数作用域下的对象，只能在当前函数内部才能获取到的（闭包除外）。

var outerVal = 'outer';
function testFn (){
    var innerVal = 'inner';
}
console.log(innerVal);//innerVal is not defined

var testVal = 'outerVal';
function test(){
  console.log(testVal);
  var testVal = 'innerVal';
}
test();//undefined

//等价于

var testVal = 'outerVal';
function test(){
  var testVal;
  console.log(testVal);
  testVal = 'innerVal';
}
test();

• JS中都是以函数级别的作用域进行划分变量的
  即使是var，内部的var变量也会顶掉外部同名的变量

4. 块级作用域

ES6 let/const的特性，这里不谈。

5. 上下文属性

• 变量对象VO，激活初始化（使用arguments）后变成AO
• 作用域链（Scope Chain），解构类似数组，有以下部分组成
  • 当前作用域的AO
  • 引擎的[[scope]]，存储了当前祖辈的作用域，以类数组方式存储
• this

6. 闭包

【广义】上所有的函数都是闭包，因为所有的函数都会包含Global作用域

【狭义】上一般有以下几种定义方式：

• 有权访问另一个函数作用域内变量的函数
• 执行和定义不在一个作用域的函数

从实践的角度：

• 即使创建他的上下文已经销毁（一般函数执行完后，函数的上下文会被销毁），它依然存在（比如，内部函数从父函数中返回）
• 在代码中引用了自由变量(即：使用变量X，但是X不是在当前函数中定义的)

function testFn() {
    var testVal = 'I am an innerVal';
   return function () {
    return testVal;
   }
}
var closureFn = testFn();
console.log(closureFn());//I am an innerVal
closureFn = null;//让GC回收，释放内存

上述代码中的closureFn方法能一直拿到testFn中的变量testVal，
原因是即使testFn()执行完，其上下文被销毁了，但是内部匿名函数的作用域链上保留了testFn的AO，
引擎发现有对testFn内部变量的引用，所以不会回收testFn，只有将closureFn置为null，GC才会自动释放其内存，否则这里就是一个内存泄漏点。