<!doctype html> <html> <head> <meta charset="utf-8"> <title>时生闭包的学习,教程来自妙味课堂</title> <script> //------------------------------------------------------------------------------------------- //1.什么是闭包 //函数嵌套函数,内部函数可以引用外部函数的参数和变量,变量和参数不会被垃圾回收机制所收回 /* function aaa(a){var b = 5;function bbb(){console.log(a); //a,b可以访问到,并不会被垃圾回收机制回收console.log(b); } } aaa(); *//*JS中的垃圾回收机制 function aaa(){var a = 1; } 这个函数执行完,这个变量a就会被回收机制回收了。*///测试 /* function aaa(){var a = 5;function bbb(){console.log(a);}return bbb; } var c = aaa(); c();//c = bbb(); 弹出5 *///------------------------------------------------------------------------------------------- /* 2.闭包的好处 1)希望一个变量长期驻扎在内存中 2)避免全局变量的污染 3)私有成员的存在 */ //用法1.模块化代码 //用法2.在循环中直接找到对应元素的索引 /*var a = 1; function aaa(){a++;alert(a); } aaa(); //2 aaa(); //3 alert(a);//在函数外可以调用。*//*function aaa(){var a = 1; //局部变量a++;alert(a); }aaa(); //2 aaa(); //2 每次都重新执行了 *//*function aaa(){var a = 1; return function(){a++;alert(a); } } var c = aaa(); c(); //2 c(); //3*/ //alert(a); //a is not defined//用法1.模块化代码 /* (function(){}) //函数表达式 (function(){})() //调用*//* var aaa = (function(){var a = 1;return function(){a++;alert(a);} })()//模块化代码,避免全局变量的污染aaa(); aaa();*//* var aaa =(function(){var a= 1; //私有属性function bbb(){ //私有方法a++;alert(a);}function ccc(){a++;alert(a);}return {b:bbb,c:ccc} })() aaa.b(); //2 aaa.c(); //3 alert(a); //没有找到 is not defined alert(bbb); //没有找到 is not defined alert(ccc); //没有找到 is not defined *///用法2.在循环中直接找到对应元素的索引 window.onload = function(){var _li = document.getElementsByTagName("li");/*for(var i = 0 ; i < _li.length ; i++){//循环执行结束制还没执行onclick_li[i].onclick = function(){alert(i); //点击都为3}}*///写法一/*for(var i = 0 ; i < _li.length ; i++){(function(i){//利用闭包将i作为参数传进来_li[i].onclick = function(){alert(i); // 0,1,2}})(i)}*///写法二/*for(var i = 0 ; i < _li.length ; i++){_li[i].onclick = (function(i){return function(){alert(i); // 0,1,2}})(i)}*/ //-------------------------------------------------------------------------------- //3.使用闭包需要注意什么? //闭包在IE下容易引发内存泄漏 //内存泄漏会导致页面跳转时变量还没释放导致CPU一直增加,只有关闭浏览器才会释放。 //引发原因 //当一个变量(oDiv)是DOM节点或数组对象的时候,他的一个属性(oDiv.onclick)去引用一个内部函数,而内部函数里的变量又去引用外部的(oDiv.id)var oDiv = document.getElementById('div1');oDiv.onclick = function(){alert(oDiv.id); };//解决方法1. 变量属性为NULL; window.onunload = function(){oDiv.onclick = null; }//解决方法2.将对象为NULL;var oDiv = document.getElementById('div1');var id = oDiv.id;oDiv.onclick = function(){alert(id); };oDiv = null; }</script> </head> <body> <ul id="myul"> <li>11111</li> <li>22222</li> <li>33333</li> </ul><div id="div1">aaaa</div> </body> </html>
本文主要是介绍时生闭包的学习,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
转载于:https://www.cnblogs.com/-gap/archive/2012/09/08/2676666.html
这篇关于时生闭包的学习的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!