简单理解Javascript闭包
2019-08-14 09:54:37来源:博客园 阅读 ()
理解闭包,先了解一下Javascript变量的作用域。有两种,全局变量和局部变量。
例子1:
<script> var a = 0; function fun(){ var b = 0; console(a+" "+b); } </script>
a是全局变量,b是局部变量。函数内部可以直接读取全局变量,但是在函数外部无法读取函数内部的局部变量。
如何从外部读取函数内部的局部变量?
例子2:
function fun(num){ var b = 0; b += num; return b; } var re_b = fun(1); console.log(re_b); //1 re_b = fun(2); console.log(re_b); //2
fun()将局部变量b作为返回结果;
例子3:
function fun(){ var b = 0; function fun2(num){ b += num; return b; } return fun2 } var re_b = fun(); console.log(re_b(1)); //1 console.log(re_b(2)); //3
简单分析一下例子3代码:
定义普通函数fun;
在fun中定义变量b,普通函数fun2(参数),返回fun2;
在fun2中将参数num与b相加后赋予b,返回b;
执行fun,并把返回结果赋予re_b,此时re_b的类型为function;
执行re_b(1),结果输出1(0+1);
执行re_b(2),结果输出3(1+2);
上述方法即为闭包。
在了解闭包的作用之前,我们先了解一下 Javascript 中的 垃圾回收 机制,在 Javascript 中,如果一个对象不再被引用,那么这个对象就会被 GC 回收,否则这个对象一直会保存在内存中。
例子2中,执行完fun,变量b就会被释放回收;
例子3中,fun2定义在fun中,即fun2依赖于fun,全局变量re_b引用fun2,fun就间接被引用,即fun和fun2与re_b共存亡。只要re_b没被释放回收,变量b就一直在内存中。这也就是闭包的作用,fun执行完并返回后,闭包使得Javascript的垃圾回收机制GC不会收回fun所占用的资源。
一句话说,当一个内部函数被其外部函数之外的变量引用时,就形成了一个闭包。
闭包的应用场景:保护函数内的变量安全;在内存中维持一个变量;通过保护变量的安全实现JS私有属性和私有方法。
闭包的一个简单应用:
for(var i=0;i<5;i++){ setTimeout(function(){ console.log(i) },1000*i) }
结果为,每秒钟输出一个5,一共输出5次。
for(var i=0;i<5;i++){ (function fun(i) { setTimeout(function(){ console.log(i) },1000*i) })(i) }
结果为,每秒钟输出一个数,0,1,2,3,4。
第一个例子中每次循环中的setTimeout回调函数记住的i的值是for循环作用域中的值,此时都是5,而第二个例子记住的i的数为setTimeout的父级作用域自执行函数中的i的值,依次为0,1,2,3,4。
注意点:由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,滥用闭包,会造成网页的性能问题,在IE中可能导致内存泄露
原文链接:https://www.cnblogs.com/HQiIce/p/11090157.html
如有疑问请与原作者联系
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
下一篇:js获取客户端IP
- javascript面向对象入门基础详细介绍 2020-03-29
- JavaScript函数表达式详解及实例 2020-03-25
- 如何用javascript连接access数据库 2020-03-20
- js中去掉字串左右空格 2020-03-20
- Javascript中的经典技巧 2020-03-20
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash