谈及javascript的闭包,可能想到的就是内存泄露,慎用闭包,但是实际上闭包还有更多好的作用:

1,可以将for循环的变量封闭在闭包环境中,下面这种情况,无论点击1-5div,最终打印的都是5,因为点击事件是异步,for循环时候,i是同一个,最终都会进阶到5,所以输出5。使用闭包进行i变量的封闭保存。

<html>
<body>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
</body>
<script>
var nodes = document.getElementsByTagName('div');
for(var i = 0;i<nodes.length;i++){
nodes[i].onclick = function(){
console.log(i)
}
}
</script>
</html>
for(var i = 0;i<nodes.length;i++){
(function(k){
nodes[k].onclick = function(){
console.log(k)
}
})(i)
}

2,封装变量

可以将一些不需要暴露在全局的变量封装成“私有变量”,比如下面的cache变量是可以抽成局部变量,不需要暴漏在全局,闭包就可以封装变量。

var mult = (function(){
var cache = {};
return function(){
var args = Array.prototype.join.call(arguments,',');
if(cache[args]){
return cache[args]
}
var a = 1;
for(var i = 0,l = arguments.length;i<l;i++){
a = a * arguments[i]
}
return cache[args] = a;
}
})() console.log(mult(1,2,3))

3,延续局部变量的寿命

var report = function(src){
var img = new Image();
img.src = src;
} report('http://xxx.com/getUserInfo')

该函数在低版本的浏览器会存在数据上报丢失的bug,原因是report函数在调用结束后,img局部变量被销毁,或许没来得及发送http请求,请求就丢失掉,应该将img变量用闭包封闭起来。

var report = (function(){
var imgs = [];
return function(src){
var img = new Image();
imgs.push(img);
img.src = src;
}
})()

闭包会导致内存泄露,尽量减少闭包的使用,这种说话恐怕有点骇人听闻,不过局部变量在函数退出时候没有被销毁确实会导致内存泄露,但是闭包的好处却常常被忽略,有时候我们主动选择将变量封闭在闭包中,可能后续还会用到这个变量,这时候放在全局和放在闭包中对内存的影响是一致的,如果将来需要回收这些变量,可以手动设为null即可。

使用闭包容易导致循环引用。如果闭包的作用域链中存在一些DOM节点,这时就容易引起内存泄露。其实一些变量的内存泄露就是变量没有被及时回收,这些对系统的影响不是很大,最可怕的就是循环引用,会立马导致内存飙升,这个是要重视的点。

解决循环引用带来的内存泄露,也是将其中的变量设置为null即可。

说说js循环引用的例子:

var a={b:1};
a.b=a;

猜测下a的最终输出,{b:{b:{b:{b:......}}}}

用console打印是不会报错的,但是JSON.stringify(a)会报错,循环引用使用该语法报错。

var a={"name":"zzz"};
var b={"name":"vvv"};
a.child=b;
b.parent=a;

上面的例子也是一个循环引用。a和b对象互相引用,内存得不到释放。

还有js对象和COM对象的循环引用:

IE中有一部分对象并不是原生的js对象,而是COM对象,采用计数策略,例子:

var element = document.getElementById("some_element");
var myObject = new Object();
myObject.element = element;
element.someObject = myObject;

一个DOM元素和原生js对象之间存在循环引用,即使DOM从页面移除,也不会被回收,因为myObject仍然在引用。

避免循环引用发生,最好在不用时候切断js对象和dom元素之间的连接。

myObject.element = null;

element.someObject = null;

【完】

色即是空,空即是色,受想行识,亦复如是。

  

javascript闭包的用处的更多相关文章

  1. javascript 闭包(转)

    一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量 ...

  2. JavaScript闭包学习笔记

    此文都是大牛们关于闭包的观点,在此只是总结. 闭包应用的两种情况即可——函数作为返回值,函数作为参数传递. 1 深入理解javascript原型和闭包 判断一个变量是不是对象非常简单.值类型的类型判断 ...

  3. 对于 Javascript 闭包理解

    一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量 ...

  4. 深入理解javascript闭包(一)

    闭包(closure)是Javascript语言的一个难点.也是它的特色,非常多高级应用都要依靠闭包实现. 一.什么是闭包? 官方"的解释是:闭包是一个拥有很多变量和绑定了这些变量的环境的表 ...

  5. 深入理解javascript闭包(一)

    原文转自脚本之家(http://www.jb51.net/article/24101.htm) 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. ...

  6. JavaScript“闭包”精解

    一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. 详细了解 Javascript语言的特殊之处,就在于函数内部可以直接读 ...

  7. JavaScript学习总结(十六)——Javascript闭包(Closure)

    原文地址: http://www.cnblogs.com/xdp-gacl/p/3703876.html 闭包(closure)是Javascript语言的一个难点,也是它的特色, 很多高级应用都要依 ...

  8. [转载]学习Javascript闭包(Closure)

    学习Javascript闭包(Closure)     源地址: http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures ...

  9. javascript闭包和this对象

    闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域 ...

随机推荐

  1. Linux中vim的基本操作

    Vim三种模式之间的相互转换: 1.拷贝当前行 yy,拷贝当前行的向下五行 5yy,粘贴使用p: 2.删除当前行 dd,删除当前行的向下五行 5dd: 3.在文件中查找某个单词[命令行模式下  /关键 ...

  2. 【转】HeadFirst 组合模式+迭代器错误原因以及解决代码

    http://blog.csdn.net/sugar_girl/article/details/53400267     <HeadFirst JAVA设计模式>中用迭代器迭代组合模式是存 ...

  3. php mb_substr()函数的详细解释!

    PHP substr()函数可以分割文字,但要分割的文字如果包括中文字符往往会遇到问题,这时可以用mb_substr()/mb_strcut这个函数,mb_substr() /mb_strcut的用法 ...

  4. 概率/期望DP初步——BZOJ1415 聪聪和可可

    期望相关: 数学期望,可以简单理解的加权平均数.设有一系列的值$x_i$,每个值被取到的概率为$p_i$,则期望$E=\sum\limits_{i=1}^n p_i x_i$. 期望具有线性性:$$E ...

  5. python模块之shelve,xml,hashlib,configpaser

    shelve shelve模块也是一种可以将数据序列化的模块 使用方法 1. open 2. 读写 3. close 特点:使用方法比较简单 提供一个文件名字就可以开始读写,读写的方法和字典一致;跨平 ...

  6. FPGA模N计数器的实现

    module ModuloN_Cntr(Clock, Clear, Q, QBAR); , UPTO = ;//计数器位数以及模数 input Clock, Clear; :]Q, QBAR; :]C ...

  7. Integer 中的缓存类 IntegerCache

    我们先看一段代码: public class TestAutoBoxing { public static void main(String[] args) { //-128到127之间 Intege ...

  8. 蒲公英Ghost Win 7 Sp1(x86/x64)旗舰版 201910

    蒲公英Ghost Win 7 Sp1(x86/x64)旗舰版 201910 <ignore_js_op>  <ignore_js_op> <ignore_js_op> ...

  9. 细看Java序列化机制

    概况 在程序中为了能直接以 Java 对象的形式进行保存,然后再重新得到该 Java 对象,这就需要序列化能力.序列化其实可以看成是一种机制,按照一定的格式将 Java 对象的某状态转成介质可接受的形 ...

  10. Python: Socket网络编程,多线程处理小Demo

    一个简单的例子,深入研究一下socket的多线程处理任务 Server端: #!/usr/bin/env python #encoding:utf8 # # 注意:定义encoding时必须在第二行 ...