红宝书总结-执行环境、作用域链-CSDN博客

执行环境、作用域链

基本概念

执行环境定义了变量或函数有权访问的其他数据，决定了他们各自的行为。每个执行环境都有一个与之关联的变量对象，环境中定义的所有变量和函数都保存在这个对象中（开发者无法访问，解析器在后台使用）
全局执行环境是最外围的一个执行环境。web浏览器中，全局执行环境被认为是window对象——因此，所有全局变量和函数都是作为window对象的属性和方法创建的。
某个执行环境中的所有代码执行完毕后，该环境被销毁，保存在其中的所有变量和函数定义也随之销毁（全局执行环境直到应用程序退出，如网页关闭or浏览器关闭时才会被销毁）
每个函数都有自己的执行环境。当执行流进入一个函数时，函数的环境就会被推入一个环境栈中。而在函数执行之后，栈将其环境弹出，把控制权返回给之前的执行环境。
当代码在一个环境中执行时，会创建变量对象的一个作用域链，作用域链保证对执行环境有权访问的所有变量和函数的有序访问。作用域链的前端，始终都是当前执行的代码所在环境的变量对象。如果这个环境是函数，则将其活动对象作为变量对象。活动对象在最开始时只包含一个变量，即arguments对象（arguments对象在全局环境中不存在）
标识符解析是沿着作用域链一级一级的搜索标识符的过程。

延长作用域链

执行环境的类型总共只有两种——全局和局部（函数）
有些语句可以在作用域链的前端临时增加一个变量对象，该变量对象会在代码执行后被移除。 a. try-cath语句的catch块--创建一个新的变量对象，其中包含的是被抛出的错误对象的声明 b. with语句--会将指定的对象添加到作用域链中
```
    （with语句实例）
    function buildUrl(){
        var qs = "?debug=true";
        with(location){
            var url = href + qs
        }
        return url;
    }
复制代码
```
with接收了location对象，因此其变量对象中就包含了location对象的所有属性和方法。因此，其内部的href其实就是location.href。而url成了函数执行环境的一部分，所以可以作为函数的值被返回。

没有块级作用域

声明变量

使用var声明的变量会自动添加在最近的环境中，在函数内部，最接近的环境就是函数的局部环境；在with语句中，最接近的环境是函数环境。如果初始化变量时没有使用var声明，该变量会自动被添加到全局环境。
```
function(){
    var a=b=1;//a:function内;b:全局内
}
复制代码
```
严格模式下，初始化未经声明的变量会导致错误
查询标识符

使用标识符时，通过搜索来确定该标识符实际代表什么。搜索过程从作用域链的前端开始，向上逐级查询与给定名字匹配的标识符。如果在局部环境中找到，搜索过程停止，变量就绪。如果在局部环境中没找到，则继续沿作用域链向上搜索，直至全局环境的变量对象。如果全局环境中也没有，则意味着该变量尚未声明。

let与块级作用域

以上内容都是es5。es6中，引入let，从而产生了块级作用域的概念
var有一种“变量提升”的现象，即变量可以在声明前使用，值为undefined；但是let定义的变量，如果在声明前使用，会直接报错

console.log(foo);//undefined
var foo = 2;

console.log(bar);//报错
let bar = 2;
复制代码

暂时性死区：变量在let声明前使用会直接报错，这就产生了一个“暂时性死区”：

var tmp = 123;
if(true){
    tmp = 'abc';//报错
    let tmp;
}
复制代码

es6明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭的作用域。凡是在声明之前就使用这些变量，就会报错

暂时性死区意味着typeof不再是一个百分之百安全的操作
typeof x;//报错
let x;

typeof undeclared_variable//undefined
复制代码

块级作用域与函数声明

es5中函数声明不能在块级作用域内定义；但是浏览器不会报错；
es6中允许在块级作用域中声明函数，函数声明语句的行为类似于let，在块级作用域之外不可引用——但是，es6浏览器为了兼容老代码，定义函数声明类似于var，即会提升到全局作用域或函数作用域的头部；同时，函数声明还会提升到所在块级作用域的头部

function f() { console.log('I am outside!'); }

(function () {
  if (false) {
    // 重复声明一次函数f
    function f() { console.log('I am inside!'); }
  }

  f();
}());
es5浏览器中运行：I am inside!因为将f提升到了函数头部

es6浏览器：报错：
相当于
function f() { console.log('I am outside!'); }
(function () {
  var f = undefined;
  if (false) {
    function f() { console.log('I am inside!'); }
  }

  f();
}());
复制代码

所以，不要在块级作用域内定义函数
另外，这种情形注意下:

// 不报错
'use strict';
if (true) {
  function f() {}
}

// 报错
'use strict';
if (true)
  function f() {}
复制代码

红宝书总结-执行环境、作用域链

执行环境、作用域链

所以，不要在块级作用域内定义函数