简述JavaScript做用域与做用域链

    关于变量做用域的知识,相信学习JavaScript的朋友们必定早已经接触过,这里简单列举:  javascript

  • JavaScript中变量是以对象属性的形式存在的:全局变量是全局对象的属性;局部变量是声明上下文对象的属性。(声明上下文对象是一个对用户不可见的内部实现,没法被引用,每当函数调用便建立这个对象以存放局部变量)
  • JavaScript虽然是解释型语言,但也存在预处理过程,其中便包含了声明提早。JavaScript解释器运行前,会先将整个程序中的变量声明(包括函数)提早到做用域顶部执行。因此在程序中变量的使用语句能够出如今声明语句以前。
  • JavaScript中没有块级做用域(像C语言那样用方括号{}划分做用域),而是使用函数做用域;
  • 不在任何函数体内声明的变量为全局变量,拥有全局做用域,能够在程序的任何位置被访问;而在函数内声明的变量(包括函数的参数)为局部变量,拥有局部做用域,只在函数内部有定义;
  • 若局部变量与全局变量重名,局部变量优先级高,能够遮盖全局变量;
  • 局部做用域能够相互嵌套(由于函数能够嵌套)

    而 做用域链的概念,接触过的人就没那么多了。其实做用域链很好理解,上方第一条已经明确了,JavaScript中变量是以对象属性的形式存在的,而做用域链其实就是这些对象组成的一个链表。全局变量是全局对象的属性,局部变量是声明上下文对象的属性。这些对象按从内向外的顺序连接,链尾固然就是全局对象。当函数运行中须要查找某一个变量的时候,就会沿着做用域链依次查询每一个对象是否拥有与该变量同名的属性,若是存在则直接使用;若整条链上都不存在这个属性,便抛出ReferenceError。 在函数定义的时候,便建立了做用域链,链上的对象顺序便肯定下来,当函数被调用,建立相应的对象添加到做用域链中,做用域链会随着函数的定义调用而更新。在嵌套函数中更是如此,每次调用外部函数时,内部函数又会从新定义,随之带来的就是做用域链的相应变化。关于做用域链的数量,能够用树来比喻,全局对象是根节点,函数的嵌套表明着树节点的层级关系,那么一个程序中做用域链的数量等于对应树中叶子节点的数量。
var a = 1;// 最外层的做用域链上只有全局对象

function func1(){
	var a = 2; // 这一层的做用域链: func1的声明上下文对象 ——> 全局对象
	function func2(){
		var a = 3; // 这一层的做用域链: func2的声明上下文对象 ——> func1的声明上下文对象 ——> 全局对象
		console.log("in func2's scope a= " + a + "  ");
	}
	func2();
	console.log(console.log("in func1's scope a= " + a + "  ");) 
}
func1();
console.log(console.log("a= " + a + "  "););

    运行结果能够很清楚的反映出做用域链的查询顺序。

     关于做用域链还不得不提with语句,它能够进行临时性做用域链扩展。它的语法是这样的:with(object){ statement }。 它将object添加到做用域链的顶部,而后执行语句,执行完毕后将做用域链恢复到原始状态。在对象嵌套层次很深的时候,可使用with语句简化代码。下面的两段代码是等价的:
var object = {
		object1: {
			name : {
				firstName: "hello",
				lastName: "world",
				nickName: "Jeff"
			}
		}
	};
object.object1.name.firstName = "aaa";
object.object1.name.lastName = "bbb";
object.object1.name.nickName = "ccc";

var object = {
		object1: {
			name : {
				firstName: "hello",
				lastName: "world",
				nickName: "Jeff"
			}
		}
	};

with(object.object1.name){
	firstName = "aaa";
	lastName = "bbb";
	nickName = "ccc";	
}

     with语句在严格模式中是被禁止使用的,在非严格模式也不推荐使用。使用with语句的代码难以优化,而且运行速度更慢。因此上面这种状况咱们可使用下面的方法等价使用,减小代码:
var object = {
		object1: {
			name : {
				firstName: "hello",
				lastName: "world",
				nickName: "Jeff"
			}
		}
	};
var temp = object.object1.name;
temp.firstName = "aaa";
temp.lastName = "bbb";
temp.nickName = "ccc";	
相关文章
相关标签/搜索