闭包
程序员文章站
2022-07-12 13:15:15
...
按照C语言当中的语法习惯我们要输出1~10十个数字时通常会采用循环的方式
function test (){
var arr = [];
for(var i = 0; i<10; i++){
arr[i] = function(){
document.write(i+" ");
}
}return arr;
}
var myArr = test();
for (var j = 0; j < 12; j++){
myArr[j]();//10 10 10 10 10 10 10 10 10 10
}
//形成闭包,函数执行时i已经变成十,所以打印出来的所有值都是10
但是在JavaScript中打印的结果却不是这样。那究竟是为什么?闭包是什么?闭包是怎样形成的?
在了解闭包之前我们还因该了解一下立即执行函数
闭包:当内部函数被保存到外部时会生成闭包。闭包会导致原有的作用域链不被释放造成内存泄漏。
闭包的作用
- 实现公有变量(在这段代码中num既是一个公有变量)
function add(){
var num = 0;
function a(){
console.log(++num);
}
return a;
}
var myAdd = add();
myAdd(); //1
myAdd(); //2
myAdd(); //3
在这段函数执行的过程中发生以下过程
add defined ==> addAO:var num = 0 ; var a = function a( ) { };
GO: var myAdd = add( );
//add( );执行后的返回值是 function a( ) { };
add doing ==> aAO: num = 0;
Myadd doing ==> aAO: num = 1;
- 可以作为缓存(存储结构)
function eater (){
var food = ""; //此时food相当于一个隐式的存储结构
var obj={
eat : function(){
console.log("i am eating" + food);
food = "";
},
push: function(myF00d){
food=myF00d;
}
}
return obj;
}
var eater1 = eater();
eater1.push(" xiaohaibao");
eater1.eat();//"i am eating xaiohaibao"
- 可以实现函数封装,属性私有化
实现属性私有化
function Bao(name,hobbit){
var yHobbit = "smoke";
this.name = name;
this.hobbit = hobbit;
this.YHobbit = function(){
this.hobbit =yHobbit;
}
this.sayYHobbit = function(){
console.log(yHobbit);
}
}
var xiaohai=new Bao('xioahai','yutingbai')
- 模块化开发,防止污染全局变量
模块化开发
var bai = (function saybai(){
var name = "yutingbai";
function sayname(){
console.log(name);
}
return function (){
sayname();
}
}());
var bao = (function saybao(){
var name = "xiaohaibao";
function sayname(){
console.log(name);
}
return function (){
sayname();
}
}());
//bai(); ==> yutingbai bao(); ==>xiaohaibao
利用立即执行函数以及闭包,使得变量名称不互相干扰