总结JavaScript在IE9之前版本中内存泄露问题


Posted in Javascript onApril 28, 2018

IE9之前的版本对JScript对象和COM对象使用不同的垃圾回收例程(COM对象采用“引用计数”收集策略),因此闭包在IE的这些版本中会导致一些特殊问题。具体来说,如果闭包的作用域中保存着一个HTML元素,那么就意味着该元素将无法被销毁。
来看下面的例子:

function assignHandler() {
  var elem = document.getElementById('elem_id');
  elem.onclick = function(evt) {
    alert(elem.id);
  };
}

以上代码创建了一个作为elem元素事件处理程序的闭包,而这个闭包则又创建了一个循环引用。由于匿名函数保存了一个对assignHandler()的活动对象的引用,因此就会导致无法减少elem的引用数。只要匿名函数存在,elem的引用数至少也是1,因此它所占用的内存就永远不会被回收。

可以将上面的代码稍作修改一下就可以解决:

function assignHandler() {
  var elem = document.getElementById('elem_id');
  var elem_id = elem.id;
  elem.onclick = function(evt) {
    alert(elem_id);
  };
  elem = null;
}

通过把elem.id的一个副本保存在一个变量中,并且在闭包中引用该变量消除了循环引用。但仅仅做到这一步,还是不能解决内存泄露问题。

“闭包会引用包含函数的整个活动对象,而其中就包含着elem。即使闭包不直接引用elem,包含函数的活动对象中也仍然会保存一个引用。因此,有必要把elem设置为null。这样就能解除对DOM对象的引用,顺利地减少其引用数,确保正常回收其占用的内存”

Javascript 相关文章推荐
tagName的使用,留一笔
Jun 26 Javascript
JS 动态加载js文件和css文件 同步/异步的两种简单方式
Sep 23 Javascript
简单的js表格操作
Sep 24 Javascript
原生js实现对Ajax的封装(仿jquery)
Jan 22 Javascript
详解Weex基于Vue2.0开发模板搭建
Mar 20 Javascript
使用vux实现上拉刷新功能遇到的坑
Feb 08 Javascript
angularJS实现动态添加,删除div方法
Feb 27 Javascript
如何为vuex实现带参数的 getter和state.commit
Jan 04 Javascript
Angular Excel 导入与导出的实现代码
Apr 17 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
May 27 Javascript
JavaScript设计模型Iterator实例解析
Jan 22 Javascript
Vue多选列表组件深入详解
Mar 02 Vue.js
vue-baidu-map 进入页面自动定位的解决方案(推荐)
Apr 28 #Javascript
Vue2.0实现调用摄像头进行拍照功能 exif.js实现图片上传功能
Apr 28 #Javascript
React native ListView 增加顶部下拉刷新和底下点击刷新示例
Apr 27 #Javascript
React Native日期时间选择组件的示例代码
Apr 27 #Javascript
vue实现点击展开点击收起效果
Apr 27 #Javascript
vue中post请求以a=a&b=b 的格式写遇到的问题
Apr 27 #Javascript
vue项目中应用ueditor自定义上传按钮功能
Apr 27 #Javascript
You might like
php中global和$GLOBALS[]的分析之一
2012/02/02 PHP
php单链表实现代码分享
2016/07/04 PHP
php使用strip_tags()去除html标签仍有空白的解决方法
2016/07/28 PHP
Codeigniter里的无刷新上传的实现代码
2019/04/14 PHP
几个高效,简洁的字符处理函数
2007/04/12 Javascript
javascript 常用代码技巧大收集
2009/02/25 Javascript
浅析js封装和作用域
2013/07/09 Javascript
Flex通过JS获取客户端IP和计算机名的实例代码
2013/11/21 Javascript
javascript设计模式之工厂模式示例讲解
2014/03/04 Javascript
js命名空间写法示例
2015/12/18 Javascript
如何通过js实现图片预览功能【附实例代码】
2016/03/30 Javascript
拥Bootstrap入怀——导航栏篇
2016/05/30 Javascript
关于Function中的bind()示例详解
2016/12/02 Javascript
nodejs实现OAuth2.0授权服务认证
2017/12/27 NodeJs
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
2018/01/08 jQuery
关于layui 实现点击按钮添加一行(方法渲染创建的table)
2019/09/29 Javascript
ES6 Promise对象概念及用法实例详解
2019/10/15 Javascript
Python实现冒泡,插入,选择排序简单实例
2014/08/18 Python
在Lighttpd服务器中运行Django应用的方法
2015/07/22 Python
KMP算法精解及其Python版的代码示例
2016/06/01 Python
python中利用await关键字如何等待Future对象完成详解
2017/09/07 Python
python3爬虫之设计签名小程序
2018/06/19 Python
Scrapy框架基本命令与settings.py设置
2020/02/06 Python
django 实现手动存储文件到model的FileField
2020/03/30 Python
keras K.function获取某层的输出操作
2020/06/29 Python
详解pandas赋值失败问题解决
2020/11/29 Python
FOREO斐珞尔官方旗舰店:LUNA露娜洁面仪
2018/03/11 全球购物
JAVA高级程序员面试题
2013/09/06 面试题
激情洋溢的毕业生就业求职信
2014/03/15 职场文书
投标授权委托书范文
2014/08/02 职场文书
党员反对四风问题思想汇报
2014/09/12 职场文书
开展批评与自我批评发言稿
2014/10/16 职场文书
遗愿清单观后感
2015/06/09 职场文书
交通安全学习心得体会
2016/01/18 职场文书
JavaScript使用canvas绘制坐标和线
2021/04/28 Javascript
详解Golang如何实现支持随机删除元素的堆
2022/09/23 Python