js闭包-javascript-closure
概念
先看一段代码
function t1(){
var age = 22;
function t2(){
alert(age);
}
return t2;
}
var tmp = t1();
var age = 99;
tmp();//22复制代码
在大部分的语言中,t1被调用执行,则申请内存,并把局部变量push入栈。t1函数执行完毕,内部的局部变量随着函数的退出而销毁。因此,age = 22这个局部变量就消失了。
但是在js中,age = 20这个变量却被t2捕捉,即使t1执行完毕,通过t2依然能够访问该变量。这种情况》返回的函数,并非孤立的函数,甚至把其周围的变量环境,形成了封闭的“环境包”,共同返回,所以叫闭包。
概括:函数的作用域取决于声明时,而不取决于调用时。
闭包计数器
问题:多个人开发js程序,需要一个全局计数器,多个人的函数共同用一个计数器,计数器一直增长。
答:设立一个全局变量, window.cnt = 0;调用:++window.cnt; 分析:虽然这个方法可行,但是应该避免过多的使用全局变量,防止全局变量被污染。当你引用其他人的js程序时,如果他的程序内也有一个全局变量window.cnt = 'hello';那么你的全局变量就会被无情的改变了
那么如何使用闭包做计数器呢?
第一版
function counter(){
var cnt = 0;
var cnter = function (){
return ++cnt;
}
return cnter;
}
var inc = counter();
alert(inc());
alert(inc());
alert(inc());复制代码
当counter执行完毕后,除了返回的cnter函数谁也访问不到cnt变量了 但是,这样有2个问题,全局多了一个counter函数和inc变量 下面,我们使用立即执行函数。
第二版简化
var cnt = (function (){
var cnt = 0;
return function(){
return ++cnt;
}
})();
alert(cnt());
alert(cnt());复制代码
疑问:cnt不依然是全局变量吗?
在工作中,如何避免全局污染和冲突。
- 统一放在一个全局对象上,如:jquery ->$
- 每人用自己的命名空间。如:省份+姓名(hn-yk)河南+yk
第三版
jquery的计数器插件形式
var $ = {};//jquery对象
$.cnt = (function (){
var cnt = 0;
return function(){
return ++cnt;
}
})();
alert($.cnt());
alert($.cnt());复制代码
个人命名空间,在团队开发中也很常见。
var HN_YK = {};
HN_YK.cnt = (function (){
var cnt = 0;
return function(){
return ++cnt;
}
})();
alert(HN_YK.cnt());
alert(HN_YK.cnt());复制代码
【一起进步,微信公众号:qdgithub】
本文为作者原创文章,转载无需和我联系,但请注明转载链接。 【前端黑猫】