多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
> 程序的运行需要内存。只要程序提出要求,操作系统或者运行时(runtime)就必须供给内存。对于持续运行的服务进程(daemon),必须及时释放不再用到的内存。否则,内存占用越来越高,轻则影响系统性能,重则导致进程崩溃。不再用到的内存,没有及时释放,就叫做内存泄漏(memory leak)。 ## 一、常见内存泄漏的几种情况 **1、全局变量引起的内存泄漏** ~~~ function foo() { leak = 123; // leak成为一个全局变量,不会被回收 // 相当于 window.leak = 123; } function bar() { this.age = 34; // 相当于window.age = 34; } bar(); ~~~ **2、闭包引起的内存泄漏** ~~~ var foo = (function() { var score = 97; // 被闭包引用,不会被回收 return function() { console.log(score); } })(); ~~~ **3、DOM删除或清空时,事件未清除导致的内存泄漏** ~~~ $('#foo').on('click', function() { console.log(1); }).remove(); // 解决方法 $('#foo').on('click', function() { console.log(1); }).off('click').remove(); // 原始解法 var foo = document.getElementById('foo'); foo.onclick = function() { console.log(1); foo.onclick = null; } // 采用事件委托 document.onclick = function(event) { event = event || window.event; if(event.target.id == 'foo') { console.log(1); } } ~~~ **4、子元素存在引用引起的内存泄漏,如下图** ![](https://box.kancloud.cn/969cb28aabdc28895b4f3abf8093d70b_971x578.gif) 可以测试一下,表面上是删除了元素,但仍然可以打印出这个元素,所以需要手动赋值null彻底从内存中清除 **5、被遗忘的计时器或回调函数** ~~~ var someResource = getData(); setInterval(function() { var node = document.getElementById('Node'); if(node) { // Do stuff with node and someResource. node.innerHTML = JSON.stringify(someResource)); } }, 1000); ~~~ 计时器使得节点或数据的引用不再被需要了。如果间隔处理不能被回收,它的依赖也不能被回收。那意味着可能存储着大量数据的someResource,也不能被回收。 ## 二、如何规避检查是否内存泄漏? 1. 使用Chrome内存分析工具概览 2. 使用资源管理器查看 3. 其他工具查看