理解JavaScript中的作用域

执行环境及作用域

执行环境 定义了变量和函数有权访问的其他数据，决定了它们各自的行为。

执行环境，或者叫执行上下文，每个执行环境都有一个与之关联的是 变量对象。存储了所有变量和函数。

执行环境 分为：全局执行环境、函数执行环境、eval 执行环境。

在 Web 浏览器中，全局执行环境被认为是 window 对象。

每个函数都有自己的指定环境。当执行流进入一个函数，函数的环境会被推入一个环境栈（调用栈）
调用栈 中存放的就是执行上下文（变量对象）。

作用域：就是变量和函数的可访问范围。

作用域分为：全局作用域、函数作用域、块级作用域

当代码在一个环境中执行时，会创建变量对象的一个作用域链。作用域链的用途是，保证对执行环境有权访问的变量和函数可以有序访问。

代码和图例

var color = 'blue';
function changeColor() {
  var anotherColor = 'red';
  
  function swapColor() {
    var tempColor = anotherColor;
    anotherColor = color;
    color = tempColor;
  }
  
  swapColor();}
changeColor();

通过 Chrome 浏览器的控制台可以看到 调用栈（Call Stack）和 作用域（Scope）信息

1. 下图是 changeColor 函数作用域链和当前调用栈

1. 下图是 swapColor 函数作用域链和当前调用栈

当 changeColor 函数 第一次调用时，会创建一个 执行环境 及相应的 作用域链 ，并把作用域链赋值给一个特殊的 内部属性 [[Scope]]。然后使用 this，arguments 和其他参数的值来初始化 活动对象（变量对象）。外部函数始终处于作用域第二位，外部函数的外部函数处于第三位，…. 直到座位作用域链终点的 全局执行环境。

调用栈图例

当某个函数第一次被调用时，会创建一个执行环境及相应的作用域链，并把作用域链赋值给一个特殊的内部属性[[Scope]]

var a = 2;
function add(b,c){return b+c;}
function addAll(b,c){
    var d = 10;
  result = add(b,c)
  return a+result+d;
}
addAll(3,6);

本文由博客群发一文多发等运营工具平台 OpenWrite 发布