深入理解JavaScript的作用域链与闭包

### 深入理解Javascript的作用域链与闭包

#### 作用域（Scope）

在Javascript中，变量和函数的可用性受到其作用域的限制。作用域定义了变量和函数的有效范围，增强了程序的局部性和可靠性，减少了命名冲突。

- **全局作用域（Global Scope）**：在代码任何地方都能访问的对象拥有全局作用域。以下几种情况属于全局作用域：
- 最外层函数和最外层函数外部定义的变量。
- 未声明直接赋值的变量会自动成为全局变量。
- 所有`window`对象的属性。

```Javascript
var outSide = "outside";
function outFunction() {
var name = "inside";
function inSideFunction() {
alert(name);
}
inSideFunction();
}
alert(outSide); // 正确
outFunction(); // 正确
```

- **局部作用域（Local Scope）**：在函数内部定义的变量只能在该函数内访问。

```Javascript
function outFunction() {
var name = "inside name";
function inFunction() {
alert(name);
}
inFunction();
}
alert(name); // 错误
```

#### 作用域链（Scope Chain）

作用域链是Javascript引擎用于确定哪些数据可以被函数访问的一种机制。当一个函数创建时，它的作用域链会被初始化为创建此函数时可访问的所有对象。

例如，考虑以下函数：

```Javascript
function add(num1, num2) {
var sum = num1 + num2;
return sum;
}
```

在函数`add`创建时，其作用域链包含了一个全局对象，该对象包含了所有全局变量。

#### 执行上下文（Execution Context）

当函数执行时，Javascript会创建一个执行上下文（Execution Context），其中包含了函数运行所需的所有信息。执行上下文也有自己的作用域链，它从函数的作用域链初始化而来。

```Javascript
var total = add(5, 10);
```

#### 活动对象（Activation Object）

Javascript引擎还会创建一个活动对象（Activation Object），这个对象包含了函数运行期间的所有局部变量、参数以及`this`等变量。活动对象会被推入作用域链的前端，当执行上下文销毁时，活动对象也随之销毁。

#### 闭包（Closure）

闭包是指函数能够记住并访问其词法作用域的能力，即使该函数在其词法作用域之外执行。闭包是在函数创建时形成的，并且保留了对创建时作用域链的引用。

```Javascript
function newLoad() {
for (var i = 1; i <= 3; i++) {
document.getElementById('anchor' + i).Onclick= function () {
alert("you clicked anchor" + i);
};
}
}
```

在这个例子中，点击任何一个链接都会显示“you clicked anchor4”，因为所有的匿名函数都引用了同一个`i`变量，而`i`在循环结束后变成了4。

#### 闭包优化

为了避免上述问题，可以通过立即执行函数表达式（IIFE）来创建新的作用域，从而确保每个匿名函数都能正确引用对应的`i`值。

```Javascript
function newLoad() {
for (var i = 1; i <= 3; i++) {
(function (index) {
document.getElementById('anchor' + index).Onclick= function () {
alert("you clicked anchor" + index);
};
})(i);
}
}
```

通过这种方式，每个匿名函数都有自己独立的作用域，因此能正确地引用到对应的`i`值。

总结：

- 闭包是一个函数加上其创建时的作用域环境。
- 使用闭包可以保持对创建时状态的记忆。
- 闭包使得函数可以在其词法作用域之外访问其内部变量。
- 合理使用闭包可以避免常见的陷阱，如循环中的闭包问题。