这篇文章主要介绍了关于 js 内存泄露的一个好例子。需要的朋友可以过来参考下,希望对大家有所帮助
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
我把别人的例子改了一下,觉得这样写更紧凑!套用别人的原话,当一个 DOM 对象包含一个 Js 对象的引用 (例如一个 Event Handler), 而这个 Js 对象又持有对这个 DOM 对象的引用时,一个环状引用就行成了,于是在 ie 下就出现了内存泄露。点击 "运行代码" 并打开任务管理器看内存变化。分别在 ie8 和 ff 下测试,差距不用多说。
运行代码
- <html>
- <head>
- <title>
- Memory leak
- </title>
- <style>
- body{ padding: 10px; }
- </style>
- </head>
- <body>
- </body>
- <script>
- var q = [];
- var n = 0; setInterval(function() { q.push(makeSpan());
- if (q.length >= 10) {
- var s = q.shift();
- if (s) { s.parentNode.removeChild(s);
- }
- } n++;
- },
- 10);
- function makeSpan() {
- var s = document.createElement("span"); document.body.appendChild(s);
- var t = document.createTextNode("*** " + n + " ***"); s.appendChild(t); s.onclick = function(e) { s.style.backgroundColor = "red"; alert(n);
- };
- return s;
- };
- </script>
- </html>
在删除节点的时候,手动破除环状引用,把里面 setInterval 那段代码稍微改动以下:
- setInterval(function(){
- q.push(makeSpan());
- if(q.length>=10){
- var s = q.shift();
- if(s){
- s.onclick = null;//关键在这里
- s.parentNode.removeChild(s);
- }
- }
- n++;
- },10);
来源: