闭包是指有权访问另一个函数作用域中的变量的函数。
创建闭包的常见方式:就是在一个函数内部创建另一个函数:
function createComparisonFunction(propertyName){
return function(object1,object2){
var value1=object1[propertyName];
var value2=object2[propertyName];
if(value1<value2){
return -1;
}else if(value1>value2){
return 1;
}else{
return 0;
}
}
}
内部函数能够访问propertyName,因为内部函数的作用域中包含createComparisonFunction()的作用域。
理解闭包:
当某个函数被调用是,会创建一个执行环境及一个相应的作用域链。然后使用arguement和其他命名参数的值来初始化函数的活动对象。但在作用域链中,外部函数的活动对象始终位于第二位,外部函数的外部函数的活动对象处于第三位,。。。。直至作为作用域终点的全局执行环境。
function compare(value1,value2){
if(value1<value2){
return -1;
}else if(value1>value2){
return 1;
}else{
return 0;
}
}
var result=compare(5,10)
![](https://i-blog.csdnimg.cn/blog_migrate/a18b7d17ccfcf37d34f179f648079607.png)
一般来讲,但函数执行完毕后,局部活动对象就会被销毁,内存中仅保存全局作用域(全局执行环境的变量对象)。但是,闭包的情况又有所不同。
在另一个函数内部定义的函数会将包含函数(即外部函数)的活动对象添加到它的作用域链中:
var compare=createComparisonFunction("name");
var result=compare({name:"xiao"},{name:"jia"})
在匿名函数从createComparisonFunction()中被返回后,它的作用域链被初始化为包含createComparisonFunction()函数的活动对象和全局变量对象。这样,匿名函数就可以访问createComparisonFunction()中定义的变量,重要的是:createComparisonFunction()函数在执行完毕后,其活动对象也不会被销毁,因为匿名函数的作用域链中仍然在引用这个活动对象:
// 创建函数
var compareNames=createComparisonFunction("name");
// 调用函数
var result=compareNames({name:"xiao"},{name:"jia"})
// 解除对匿名函数的引用(释放空间)
compareNames=null;
随着匿名函数的作用域链被销毁,其他作用域(除了全局作用域)也都可以安全的销毁了。
调用compareNames()的过程中产生的作用域链之间的关系:
![](https://i-blog.csdnimg.cn/blog_migrate/5a337b09abb91e3c12f591ee301e3117.png)
ps: 由于闭包会携带包含它的函数的作用域,因此会比其他函数占用更多的内存。过度使用闭包可能会导致内存占用过多。
闭包与变量:
闭包只能取得包含函数中任何变量的最后一个值。
// 一
function createFunctions(){
var result=new Array();
for(var i=0;i<10;i++){
result[i]=function(){
return i;
}
}
return result;
}
// 二
function createFunctions(){
var result=new Array();
for(var i=0;i<10;i++){
result[i]=function(num){
return function(){
return num;
}
}(i)
}
return result;
}
一:每次函数返回都是10.因为每个函数的作用域链中都保存者createFunctions()函数的活动对象,所以他们引用的都是同一个变量i,当createFunctions()函数返回后,变量i的值都是10,此时每个函数都引用着这个保存变量i的同一个变量对象。
二:定义一个匿名函数,并将立即执行函数的结果赋给数组。在调用每个匿名函数时,传入了一个变量i,由于函数参数是按值传递的,所以变量i的当前值赋值给参数num.
关于this对象
this 对象是在运行时基于函数的执行环境绑定的:在全局函数中,this等于window,而但函数被作为某个对象的方法调用时,this等于那个对象。不过,匿名函数的执行环境具有全局性,因此this对象通常指向window。
var name="the window";
var object={
name:"my object",
getNameFunc:function(){
return function(){
return this.name;
}
}
}
alert(object.getNameFunc()()); //"the window" (非严格模式下)
getNameFunc()返回一个函数,因此调用object.getNameFunc()()会立即调用它返回的函数。
每个函数在被调用时都会自动取得两个特殊变量:this,arguments.内部函数在搜索这两个变量时,只会搜索到其活动对象为止。
不过把外部作用域中的this对象保存在一个闭包能够访问到的变量里,就可以让闭包访问该对象:
var name="the window";
var object={
name:"my object",
getNameFunc:function(){
var that=this;
return function(){
return that.name;
}
}
}
alert(object.getNameFunc()()); //"my object"
内存泄漏
function assignHandler(){
var element=document.getElementById("something");
element.οnclick=function(){
alert(element.id);
}
}
创建了一个作为element元素时间处理程序的闭包,而这个闭包则又创建一个循环引用。由于匿名函数保存一个队assignHandler()的活动对象的引用,因此就会导致无法减少element的引用数,它所占用的内存就永远不会被回收。
function assignHandler(){
var element=document.getElementById("something");
var id=element.id;
element.οnclick=function(){
alert(id);
}
element=null;
}
注意:闭包会引用包含函数的整个活动对象,而其中包含了element。即时闭包不直接引用,包含函数的活动对象中也仍然保存一个引用。因此,把element变量设置为null。这样能够解决对DOM对象的引用,顺利减少其引用数,确保正常回收其占用内存。