js内存泄漏的几种情况、js垃圾回收机制、内存机制

内存泄露

什么是内存泄漏

内存泄漏 (Memory leak) 其实就是我们的程序中已经动态分配的堆内存,由于疏忽或者错误没有得到释放,造成系统内存的浪费导致程序运行速度减慢甚至系统崩溃等严重后果。

  • 程序的运行需要内存。只要程序提出要求,操作系统或者运行时就必须供给内存
  • 对于持续运行的服务进程,必须及时释放不再用到的内存。
  • 否则,内存占用越来越高,轻则影响系统性能,重则导致进程崩溃

比如说:

  1. 闭包:在闭包中引入闭包外部的变量时,当闭包结束时此对象无法被垃圾回收
  2. DOM:当原有的DOM被移除时,子结点引用没有被移除则无法回收
  3. Times计时器泄露

内存泄漏的几种情况

  1. 意外的全局变量
  2. 闭包 :在闭包中引入闭包外部的变量时,当闭包结束时此对象无法被垃圾回收
  3. DOM :当原有的DOM被移除时,子结点引用没有被移除则无法回收
  4. Times计时器泄露
  5. 包括使用事件监听addEventListener 监听的时候,在不监听的情况下使用 removeEventListen er取消对事件监听
意外的全局变量
javascript 复制代码
// 意外的全局变量
function foo(arg) {
    bar = "this is a hidden global variable";
}

// this创建的意外的全局变量
function foo() {
    this.variable = "potential accidental global";
}

// foo调用自己,this指向全局对象window
foo();

以上使用严格模式,可以避免意外的全局变量。

闭包

闭包,维持函数内局部变量,使其得不到释放

javascript 复制代码
function bindEvent() {
    var obj = document.createElement('XXX');
    var unused = function () {
        console.log(obj, '闭包内引用obj, obj不会释放')
    };

    obj = null; // 解决方法
}
没有清理对 DOM 元素的引用同样造成内存泄露
javascript 复制代码
const refA = document.getElementById('refA');
document.body.removeChild(refA); // dom删除
console.log(refA, 'refA'); // 但是还存在引用能console出整个div没有被回收

refA = null;
console.log(refA, 'refA'); // 解除引用
定时器造成的内存泄漏
ini 复制代码
var someResource = getData();

setInterval(function() {
    var node = document.getElementById('Node');
    if(node) {
        // 处理node 和 someResource
        node.innerHTML = JSON.stringify(someResource));
    }
}, 1000);

如果 id 为Node的元素从 DOM 中移除,该定时器仍会存在,同时,因为回调函数中包含对 someRes ource 的引用,定时器外面的 someResource也不会被释放

手动释放内存很麻烦,所以大多数语言提供自动内存管理,减轻程序员负担,这被称之为:垃圾回收机制

垃圾回收机制

Javaseript 具有自动垃圾回收机制 (GC: Garbage Collecation)(即自动内存管理机制),也就是说,执行环境会负责管理代码执行过程中使用的内存,垃圾收集器会定期的找出那些不再继续使用的变量,然后释放内存。但是这个过程不是实时的,因为GC开销比较大并且时停止响应其他操作,所以垃圾回收器会按照固定的时间间隔周期性的执行。

原理:垃圾收集器会定期(周期性)找出那些不再继续使用的变量,然后释放其内存

通常情况下有两种实现方式:

  • 标记清除(js最常用)
  • 引用计数

标记清除

标记清除是Javascript 最常用的垃圾收回机制

  • 当变量进入执行环境时,就标记这个变量为"进入环境"。进入环境的变量所占用的内存就不能释放
  • 当变量离开环境时,则将其标记为"离开环境〞
  • 垃圾回收程序运行的时候,会标记内存中存储的所有变量。然后它会将所有在上下文中的变量,以及被在上下文中的变量引用的变量的标记去掉
  • 在此之后再被加上标记的变量就是待删除的了,原因是任何在上下文中的变量都访问不到它们了
  • 随后垃圾回收程序做一次内存清理,销毁带标记的所有值并收回它们的内存

引用计数

  • 语言引擎有一张"引用表",保存了内存里面所有的资源(通常是各种值)的引用次数。
  • 如果一个值的引用次数是 0,就表示这个值不再用到了,因此可以将这块内存释放
  • 如果一个值不再需要了,引用数却不为 0,垃圾回收机制无法释放这块内存,从而导致内存泄漏

小结

有了垃圾回收机制,不代表不用关注内存泄露。那些很占空问的值,一旦不再用到,需要检查是否还存 在对它们的引用。如果是的话,就必须手动解除引用

相关推荐
阿芯爱编程24 分钟前
最长和谐子序列,滑动窗口
前端·javascript·面试
烛阴1 小时前
开发者神器:如何在浏览器控制台玩转第三方库,让调试效率翻倍!
前端·javascript
拉不动的猪2 小时前
JQ常规面试题
前端·javascript·面试
新中地GIS开发老师2 小时前
三维GIS开发cesium智慧地铁教程(5)Cesium相机控制
javascript·arcgis·智慧城市·大学生·gis开发·webgis·地理信息科学
Shimeng_19893 小时前
前端如何通过(手机)扫描二维码下载app
前端·javascript·vue.js·二维码·扫描二维码下载软件app
Mr...Gan3 小时前
TypeScript
开发语言·javascript·typescript
前端 贾公子4 小时前
《Vuejs设计与实现》第 8 章(挂载与更新)
开发语言·前端·javascript
半碗水4 小时前
缝缝补补
前端·javascript
用户2519162427114 小时前
ES6之类的其他书写方式
javascript·ecmascript 6
咔咔库奇4 小时前
axios取消请求
开发语言·前端·javascript