Javascript高级程序设计——15-1.匿名函数和闭包

2023-11-11

1、匿名函数

表示没有定义函数名的函数

案例1-1:简单的匿名函数

function (){	//单独的匿名函数无法执行;
	alert('Lee');
}

案例1-2:将匿名函数赋值给一个变量

var box=function(){
	return 'Lee';
};
alert(box());

案例1-3:通过自我执行来执行匿名函数,即简单的“闭包”

(function(age){
	alert(age);
})(100);
//第一个括号放匿名函数,第二个圆括号执行


案例1-4:匿名函数放匿名函数

function box(){
	retrun function(){   //类似于闭包另一种写法
		return 'Lee';
	}
}
//alert(box()())
var b=box();
alert(b());


2、闭包

(1)指的是有权访问另一个函数作用域中的变量的函数

(2)创建闭包方法:在一个函数内部创建另一个函数,通过另一个函数访问这个函数的局部变量

闭包优缺点:

把局部变量驻留在内存中,避免使用全局变量(即避免全局污染)

推荐使用私有的、封装的局部变量。


案例2-1:通过闭包访问局部变量

//通过闭包访问局部变量
function box(){
	var age=100;
	return function(){
		return age;
	};
}
alert(box()());

案例2-2:实现简单的累加

案例2-2a——全局变量累加

var age=100;
function box(){
	age++;
}
alert(age);
box();
alert(age);
box();

案例2-2b——局部变量累加

function box(){
	var age=100;
	age++;
	return age;
}
alert(box());  //101
alert(box());  //空


案例2-2c——使用匿名函数实现局部变量驻留内存中,以实现累加

function box(){
	var age=100;
	return function(){
		age++;
		return age;
	};
}
var b=box();
alert(b());  //101
alert(b());  //102
b=null;    //解除引用,等待回收
alert(b());   //出现错误,由于box不再是一个函数

注意:(1)由于闭包可能会占用较多的内存,所以必须在必要时再使用内存。

(2)解除引用的的方式是:将变量重置为null


(3)循环里的匿名函数取值问题

案例3-1:简单的返回一个数组

function box(){
	var arr=[];
	for(var i=0;i<5;i++){
		arr[i]=i;
	}
	return arr;   //返回一个数组;
}
var b=box();
//alert(b.length);   //5
for(var i=0;i<5;i++){
	alert(b[i]);
}

结果:0 1 2 3 4


案例3-2:利用匿名函数返回数组中的每一个变量

function box(){
	var arr=[];
	for(var i=0;i<5;i++){
		arr[i]=(function(num){   //自我执行;
			return num;
		})(i);
	}
	return arr;   //返回一个数组;
}
var b=box();
//alert(b.length);   //5
for(var i=0;i<5;i++){
	alert(b[i]);
}

结果:第1次—0

      第2次—1

      第3次—2

      第4次—

      第5次—4


案例3-3:采用闭包将局部变量驻留在内存中,返回数组中每一个变量

function box(){
	var arr=[];
	for(var i=0;i<5;i++){
		arr[i]=(function(num){   //由于闭包可以将变量驻留在内存中,与累加相似;
			return function(){
				return num;
			}
		})(i);
	}
	return arr;   //返回一个数组;
}
var b=box();
//alert(b.length);   //5
for(var i=0;i<5;i++){
	alert(b[i]());
}

结果:第1次—0

      第2次—1

      第3次—2

      第4次—3 

      第5次—4


(4)关于this对象在闭包中的使用

案例会结合对象冒充的方式来解析this关键字

var user='The window';
var box={
	user:'The Box',
	getUser:function(){
		return function(){
			return this.user;
		}
	}
};
//alert(box.getUser()());
//对象冒充
alert(box.getUser().call(box);


解析:(1)this在全局变量中,指向的是一个window对象,可在整个函数中使用;

  (2)this在局部变量中,指向的是一个内置对象,仅在局部函数中使用,执行完就被销毁。



(4)内存泄漏

在IE的JScript对象和DOM对象使用不同的垃圾收集方式,在IE中会存在的问题——内存泄漏。

对于对象的引用无法释放掉,

解决办法——DOM、时间事件

function box(){
	var oDiv=document.getElementById('div');
	var text=oDiv.innerHTML;
	oDiv.οnclick=function(){
		alert(text);
	};
	oDiv=null;
}
box();


上述代码中,为防止占用内存的问题,在执行完后,可将其设置为null,等待回收。








本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Javascript高级程序设计——15-1.匿名函数和闭包 的相关文章

随机推荐