执行环境和作用域

执行环境（也就是常说的上下文）和作用域是js中很基础也很重要的概念， 但在很多时候，特别是看其他的文档的时候，却容易混淆概念，这篇文章试着梳理下执行环境和作用域的概念。

1、执行环境

执行环境定义了变量或函数有权访问的其他数据，决定了它们各自的行为。每个执行环境都有一个相关联的变量对象，这个对象里面保存了环境中定义的所有变量和函数。这个变量对象在编写代码是不能访问的（除了最外层的window对象），只有解析器在后台处理才能使用。

执行环境可以分成两种：全局执行环境和函数执行环境。在执行js代码之前，默认都会创建一个全局的执行环境，与之关联的是window对象，里面保存了所有全局变量和函数，直到页面关闭时才销毁。而当执行某个函数时，会创建一个活动对象，并把这个对象作为与该函数的执行环境关联的变量对象，从而创建出函数的执行环境。函数的执行环境在函数执行完之后，就会被销毁。

另外，需要提一句的是：在活动对象刚被创建时，对象中只有arguments对象一个属性。

2、作用域

了解执行环境，就可以来说作用域了。

在js中，执行环境是用环境栈来管理的。最底层的是全局执行环境，当执行到一个函数， 函数的执行环境就会被推入到环境栈中。如果在函数中继续执行函数，那么内部函数的执行环境就继续被推入环境栈。例如下面的代码：

var name = 'window';

outer();

function outer(){
    var name = 'outer';
    inner();
    //函数内部的函数
    function inner(){
        var name = 'inner';
        console.log(name);
    }
}

对应的环境栈如下：

Image.png

到下就组成一条 作用域链， 用来保证对执行环境有权访问的所有变量和函数的有序访问。解析标识符时，就沿着作用域链一级一级地搜索，也就在环境栈中从上向下一个个对象搜索，直到找到标识符，就返回，否则就报错。例如，上面的代码，执行后会输出‘inner’，当把inner函数中的定义变量语句注释之后就输出‘outer’。

2、延长作用域链

在两种情况下，虽然不是在执行函数，但也会在作用域链的前端临时增加一个变量对象：
try-catch语句的catch块
with 语句

在执行with 语句时，会将指定的对象添加到作用域链中。例如：

function getHost() {
    var res = '';
    with(location){
        res = host;
    }
    return res;
}

在上面的代码中，执行with语句时，作用域链的最顶端是临时添加的location对象，因此可以直接访问location对象的host属性获取值。

在执行catch语句时，会创建一个新的变量对象（该对象中包含被抛出的错误对象），并添加到作用域链的顶端。正因为这个原因，在js的编程中，如果不是必要的，不建议在代码中使用try-catch语句块。

备注：

在第一个例子中，我们把inner函数定义在outer函数的内部，如果是定义在outer函数外部呢？会不会有什么不同？原因是什么？