【javascript笔记】关于javascript中的闭包

最开始看《javascript高级程序设计》的时候就看到了javascript中的闭包,在第七章第二节....好大概知道了,过了段时间,好了又忘了...

我们来看这本书里面关于闭包是怎么描述的吧(应该很清楚吧):

闭包是指有权访问另一个函数作用域中的变量的函数.

[白话]闭包是函数，这里可以理解为可以访问父函数甚至祖先函数中变量的函数。

其实这里可以要理解一下作用域链,关于作用域链大家可以去看一下《javascript高级程序设计》第四章第二节.

最简单的例子:

function SuperFunc(){
var superPara=5;
return function(){
return ++superPara;
}
}

不明白闭包有什么好处于是度娘查了一下，在贴吧里面发现了答案,请看下图:

原帖吧地址请点击我。



今天刚好要写一个onmouseenter onmouseleave 事件的js函数.不得已好像要声明全局变量...感觉不对劲.所以写了一个最简单的闭包..先做下记录

以前只知道闭包的作用有不污染全局环境，还有就是模块开发[从上面的图片发现的].昨天做这个最简单的效果的时候，我就想到了，不用全局变量.用闭包：

作用一 不污染全局环境【多人协同开发有必要】：

var changeColor=function(){
var rawColor;
return function(){
$('a').on('mouseover',function(){
rawColor=    $(this).css('backgroundColor');
$(this).css('background-color','red');
//alert(rawColor);
}).on('mouseleave',function(){
//alert(rawColor);
$(this).css('background-color',rawColor);
})
}
}();
changeColor();

其实上面的代码感觉还是有点累赘,因为这个函数，是在页面初始化的时候执行。只需要执行一次，页面载入的时候执行 我们可以直接写成匿名函数立即执行，返回的函数也立即执行.代码如下：

+function(){
var rawColor;
return +function(){
$('a').on('mouseover',function(){
rawColor=    $(this).css('backgroundColor');
$(this).css('background-color','red');
}).on('mouseleave',function(){
$(this).css('background-color',rawColor);
})
}()
}();

作用二 利用闭包缓存数据：

这个也是我在伯乐在线看到的文章[第二点]知道的(原链接点我):

重复字符串(如abc=>abcabc)

function repeat(target,n){
return (new Array(n+1).join(target));
}

改良版本：

function repeat(target,n){
return Array.prototype.join.call(
{length:n+1},target);//之所以要创建带length属性的对象，是因为调用数组原型方法时，必须是一个类数组对象，而类数组对象的条件就是length为非负整数
}

不新建数组，而是用拥有length属性的对象替代，然后调用数组的join方法,性能提升很大

再改进：

var repeat=(function(){
var join=Array.prototype.join,obj={};
return function(target,n){
obj.length=n+1;
return join.call(obj,target);
}
})();

利用闭包将对象和join方法缓存起来，不用每次都新建对象和寻找方法。

一些资料:http://lazy2009.iteye.com/blog/1788685

　　　　《 JavaScript语言精粹》第四章 12 小节

有兴趣的可以去研究一下.