关于js闭包之小问题大错误

闭包是 JavaScript 开发的一个关键方面:匿名函数可以访问父级作用域的变量。

如果闭包的作用域中保存着一个 HTML 元素,则该元素无法被销毁。(下面代码来自高程)

刚看到一个关于闭包自己没注意到的地方,

function assgin() {
    var ele = document.getElementById(‘someEle‘);
    ele.onclick = function(){
        alert(ele.id);
    }
}

以上代码创建了一个作为 ele 元素事件处理程序的闭包,而这个闭包有创建了一个循环的引用,由于匿名函数保存了一个 assgin() 的活动对象的引用 ,因此无法减少对 ele 的引用次数 , 只要匿名函数存在,ele的引用次数至少是 1。我们可以稍微改写一下:

function assgin() {
    var ele = document.getElementById(‘someEle‘);
    var id = ele.id
    ele.onclick = function(){
        alert(id);
    }
    ele = null;
}

上面代码中,通过把 ele.id 的一个副本保存在一个变量中,并且在比保重引用该变量消除了循环引用,但是这样还不能解决内存泄露,闭包会引用包含函数的整个活动对象,而其中包含着 ele ,即使闭包不直接引用 ele ,包含函数的活动对象中也会保存 一个引用,因此需要把 ele 变量设置为 null ,这样就解除了对 DOM 对象的引用,减少其引用数,确保能正常回收。

翻看之前关于闭包的文章,确实学习不足   深入理解JS闭包(https://www.cnblogs.com/7qin/p/9740799.html)

摘自:https://segmentfault.com/a/1190000010477169

原文地址:https://www.cnblogs.com/7qin/p/10639969.html

时间: 2024-11-01 19:09:50

关于js闭包之小问题大错误的相关文章

JS小技巧大本事(持续更新)

1. 复制N个字符 1 String.prototype.repeat = function(num){ 2 return (new Array(++num)).join(this); 3 } 4 5 var a = 'A'; 6 a.repeat(5); //'AAAAA' 2. 替代if…else… 1 var result; 2 3 result = isTrue ? something : anotherthing; 4 result = something || anotherthin

js闭包的作用

js闭包的用途详解 js闭包可以用在许多地方.它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中.具体怎么理解呢,各位看官请仔细看好下文 我们来看看闭包的用途.事实上,通过使用闭包,我们可以做很多事情.比如模拟面向对象的代码风格:更优雅,更简洁的表达出代码:在某些方面提升代码的执行效率. 1 匿名自执行函数 我们知道所有的变量,如果不加上var关键字,则默认的会添加到全局对象的属性上去,这样的临时变量加入全局对象有很多坏处,比如:别的函数可能误用

浅谈JS闭包中的循环绑定处理程序

初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript的闭包特性. 前几天工作中写前端js代码时,遇到了遍历元素给它添加单击事件. (PS:之前也在<jQuery基础教程>第四版中看过讲循环绑定处理程序的内容,当时估计也没怎么用心看,所以没记起来.) 大神要是知道这类情况,可以关掉窗口,写这些主要是给像我一样的小白看的,谢谢! 先贴上错误的例子让大家

关于JS闭包,作者不详(转)

说明:本文由两篇文章结合而成,系从他人笔记中转过来的, 具体作者不详.因为觉得不错,遂共享之.如有侵权,立删致歉. 一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量. Js代码 var n=999; function f1(){ alert(n); } f1(); // 999 另一方面,在函数外部自然无法读取函数内的局部变量. Js代码 fun

javascript深入理解js闭包(看了挺多的,感觉这篇比较透彻)

闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量. Js代码 var n=999; function f1(){ alert(n); } f1(); // 999 另一方面,在函数外部自然无法读取函数内的局部变量. Js代码 function

MPVUE - 使用vue.js开发微信小程序

MPVUE - 使用vue.js开发微信小程序 什么是mpvue? mpvue 是美团点评前端团队开源的一款使用 Vue.js 开发微信小程序的前端框架.框架提供了完整的 Vue.js 开发体验,开发者编写 Vue.js 代码,mpvue 将其解析转换为小程序并确保其正确运行. 简单上手mpvue 官方提供了一套quickstart模板. vue init mpvue/mpvue-quickstart my-project 安装好依赖之后,执行npm run dev,将会将小程序文件打包进dis

js闭包浅了解

js闭包浅理解 要理解闭包,得先知道js的变量作用域,在js中,有两种变量作用域: 全局作用域 局部作用域 一.在函数内可以访问全局变量 比如,下面的例子: <!--lang:js--> <script> var n = 100; function f1(){ console.log(n); } f1()//返回100 </script> 上面的例子很简单,下面是另一种情况. 二.在函数外无法读取函数内的局部变量 还是一个小例子: <!--lang:js-->

[小细节,大BUG]记录一些小问题引起的大BUG(长期更新....)

[小细节,大BUG]  1. 在不久前,一个朋友出现了这样一个BUG:当UITableView加载cell的时候,自定义的cell,怎么显示,里面的文字总是显示不完全(注意,文字不长).然后,我帮忙给看了下,甚至把在storyBoard中将cell的相关属性都试了下,虽然可以解决,但是效果不理想.最终经过排查,终于发现问题所在:当自定义cell时,因为需要布局子控件,所以他重写了layoutSubviews方法,然而在此方法中没有调用[super layoutSubviews],所以造成了布局混

js闭包(closure),个人理解

一.闭包概念理解 各种专业文献上对js"闭包"(closure)定义非常抽象,贼难看懂.我的理解是,闭包就是能够读取某函数内部变量的函数.由于在Javascript语言中只有在函数内部的函数才能读取局部变量,因此可以把闭包简单理解成"定义在一个函数内部的函数".所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁. 二.用途 闭包可以用在很多地方.但它最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中. 三.使