js函数的执行环境和作用域链

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

执行环境分为：全局环境、局部环境

1、使用var声明的变量会自动被添加到最接近的环境中，在函数内部，最接近的环境就是函数的局部环境，在with语句中，最接近的环境是函数环境

如果初始化的变量没有用var声明，该变量会自动被添加到全局环境中

2、某个执行环境中的所有代码执行完毕后，该环境被销毁，保存在其中的所有变量和函数定义也随之销毁，而全局环境直到应用程序退出（关闭网页）时才会被销毁

代码如下：

<script>
	function add(num1,num2){
		var sum = num1 + num2;
		return sum;
	}
	var result = add(10,20);

	console.log(result);  // 30
	console.log(sum);  // referenceReeor:sum is not defined 
</script>

结果图：

解释：因为在函数add内部，使用var声明了一个初始化变量sum，所以该变量sum会被添加到最接近的环境中—函数add的局部环境，所以在函数add执行完之后，变量sum会被销毁，因此输出时会报错

---

代码如下：

<script>
	function add(num1,num2){
		sum = num1 + num2;
		return sum;
	}
	var result = add(10,20);

	console.log(result);  // 30
	console.log(sum);  // 30
</script>

结果图：

解释：整个代码跟第一个案例相比，只是没有使用var声明sum，在该案例中，函数add中的初始化变量sum没有使用var声明，因此，初始化变量sum会被添加到全局环境中

---

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

代码如下：

<script>
	var color = 'blue';
	function changeColor(){
		var anotherColor = 'red';
		function swapColor(){
			var tempColor = anotherColor;
			anotherColor = color;
			color = tempColor;
			// 在这里可以访问color、anotherColor、tempColor
			console.log(color);
			console.log(anotherColor);
			console.log(tempColor);
		}
		swapColor();
		// 在这里可以访问color、anotherColor，不能访问tempColor
		console.log(color);
		console.log(anotherColor);
	}
	changeColor();
	// 在这里只能访问color
	console.log(color);
</script>

结果：输出什么颜色不重要，重要的是能不能正常的输出值，如果在全局环境中输出anotherColor，会报错，anotherColor is not defined

解释：

1、以上代码共涉及3个执行环境：全局环境、changeColor的局部环境、swapColor的局部环境

全局环境无权访问changeColor的局部环境和swapColor的局部环境

而swapColor的局部环境可以访问其他两个环境，因为那两个环境是它的父执行环境
2、内部环境可以通过作用域链访问所有的外部环境，但外部环境不能访问内部环境中的任意变量和函数
3、每个环境都可以向上搜索作用域链，以查询变量和函数名，但任何环境都不能通过向下搜索作用域链而进入另一个执行环境
 

可以看下图：

 

                                                      -----本文摘自《JavaScript高级程序设计》

个人学习记录，仅供参考