概念
应用程序不再需要占用内存的时候，由于某些原因，内存没有被操作系统或可用内存池回收，就叫做内存泄漏（memory leak）
内存的生命周期
- 内存分配：当我们声明变量、函数、对象的时候，系统会自动为他们分配内存
- 内存使用：即读写内存，也就是使用变量、函数等
- 内存回收：使用完毕，由垃圾回收机制自动回收不再使用的内存
var a = 20 // 在内存中给数值变量分配空间 (JavaScript在定义变量时就完成了内存分配)
console.log(a + 100) // 使用内存
var a = null // 使用完毕之后，释放内存空间
垃圾回收机制
对垃圾回收算法来说，核心思想就是如何判断内存已经不再使用了
方法一 ：引用计数法（reference counting）
语言引擎有一张"引用表"，保存了内存里面所有的资源（通常是各种值）的引用次数。如果一个值的引用次数是0，就表示这个值不再用到了，因此可以将这块内存释放（被回收）。
const arr = [1, 2, 3, 4]
// 数组[1, 2, 3, 4]是一个值，会占用内存。变量arr是仅有的对这个值的引用，因此引用次数为 1
// 尽管后面的代码没有用到arr，它还是会持续占用内存
arr = null
// arr重置为null，就解除了对[1, 2, 3, 4]的引用，引用次数变成了0，内存就可以释放出来了
方法二 ：标记清除法(mark-and-sweep)，有三个步骤 :
- 垃圾回收器生成一个根列表。根通常是将引用保存在代码中的全局变量。在JavaScript中，window对象是一个可以作为根的全局变量。
- 所有的根都被检查和标记成活跃的（不是垃圾），所有的子变量也被递归检查。所有可能从根元素到达的都不被认为是垃圾。
- 所有没有被标记成活跃的内存都被认为是垃圾。垃圾回收器就可以释放内存并且把内存还给操作系统。
常见的内存泄漏情况
- 全局变量引起的内存泄漏
function fn() {
num = 123 // 未声明的隐式变量等同于 window.num (全局变量)
}
// 调用完了函数以后,变量仍然存在,导致泄漏
function Fn() {
this.num = 123 // this 指向了全局对象（window）
}
// 没有对象调用Fn,也没有给它绑定this, 因此this指向window
注意： 如果必须使用全局变量存储大量数据时，确保用完以后把它设置为 null 或者重新定义
- 闭包引起的内存泄露
function outFn() {
var num = 123 // 被闭包所引用的变量，不会被回收
return function() {
console.log(num)
}
}
// 调用完了函数以后,变量仍然存在,导致泄漏
- 被遗忘的定时器或回调
var serverData = loadData()
setInterval(function() {
var renderer = document.getElementById('renderer')
if(renderer) {
renderer.innerHTML = JSON.stringify(serverData)
}
}, 5000)
- dom清空或删除时，事件未清除导致的内存泄漏
<div id="container">
</div>
$('#container').bind('click', function(){
console.log('click');
}).remove();
$('#container').bind('click', function(){
console.log('click');
}).off('click').remove();
//把事件清除了，即可从内存中移除
- 反复重写同一个属性会造成内存大量占用(但关闭IE后内存会被释放)
for(i = 0; i < 5000; i++) {
hostElement.text = "asdfasdfasdf";
}
// 这种方式相当于定义了5000个属性
for(var i = 0; i < 5000; i++) {
hostElement.text = "asdfasdfasdf";
}
// 把 i 声明一下
内存泄露如何避免
- 注意程序逻辑，避免“死循环”之类的
- 减少不必要的全局变量，或者生命周期较长的对象，及时对无用的数据进行垃圾回收
- 避免创建过多的对象 原则：不用了的东西要及时归还
内存泄漏的识别方法
一、浏览器
- 打开开发者工具，选择 Timeline 面板
- 在顶部的Capture字段里面勾选 Memory
- 点击左上角的录制按钮。
- 在页面上进行各种操作，模拟用户的使用情况。
- 一段时间后，点击对话框的 stop 按钮，面板上就会显示这段时间的内存占用情况。
二、命令行
命令行可以使用 Node 提供的process.memoryUsage方法
console.log(process.memoryUsage());
// { rss: 27709440,
// heapTotal: 5685248,
// heapUsed: 3449392,
// external: 8772 }
process.memoryUsage返回一个对象，包含了 Node 进程的内存占用信息。该对象包含四个字段，单位是字节，含义如下：
- rss（resident set size）：所有内存占用，包括指令区和堆栈。
- heapTotal："堆"占用的内存，包括用到的和没用到的。
- heapUsed：用到的堆的部分。
- external： V8 引擎内部的 C++ 对象占用的内存。
判断内存泄漏，以heapUsed字段为准。
