程序设计之道无远弗届,御晨风而返。———— 杰佛瑞 · 詹姆士
JS内存泄漏看字面意思是内存泄漏出去,其实不然,内存泄漏是指一块空间使用完没有被销毁一直占用空间,这就是内存泄漏。
常见内存泄漏原因
- 全局变量引起的内存泄漏。
- 闭包引起的内存泄漏。
- 遗忘的DOM引用
垃圾回收机制
通常分为两种方式:
- 标记清除。
- 引用计数。
第一种是当变量进入到内存当中会加入一个标记,当脱离内存之后也会添加一个标记。隔段时间后垃圾回收机制会扫一下内存空间,有需要清除的变量会把他清掉。
第二种引用计数是引用一次计个1,释放一次减个1,当引用计数为0的时候才可以清掉。在IE低版本中引用计数也会造成内存泄露。
var obj1 = {};
var obj2 = [};
obj1.attr = obj2;
obj2.attr = obj1; //相互引用,即使不在使用也清除不掉
oBtn.click = function(){
var oDiv = document.getElementById('box');
oDiv.oncliak = function(){
}; //oDiv也消除不掉
oDiv = null; //解决方案,手动清除。
}
WeakMap
ES6 考虑到了这一点,推出了两种新的数据结构:WeakSet 和 WeakMap。它们对于值的引用都是不计入垃圾回收机制的,所以名字里面才会有一个"Weak",表示这是弱引用。
const wm = new WeakMap();
const element = document.getElementById('example');
wm.set(element, 'some information');
wm.get(element) // "some information"
上面代码中,先新建一个 Weakmap 实例。然后,将一个 DOM 节点作为键名存入该实例,并将一些附加信息作为键值,一起存放在 WeakMap 里面。这时,WeakMap 里面对element的引用就是弱引用,不会被计入垃圾回收机制。
也就是说,DOM 节点对象的引用计数是1,而不是2。这时,一旦消除对该节点的引用,它占用的内存就会被垃圾回收机制释放。Weakmap 保存的这个键值对,也会自动消失。
基本上,如果你要往对象上添加数据,又不想干扰垃圾回收机制,就可以使用 WeakMap。
附加一个参考例子:阮一峰的网络日志