• 闭包会导致内存泄漏吗?
  • 发布于 2个月前
  • 183 热度
    0 评论
  • 那场梦
  • 18 粉丝 58 篇博客
  •   
背景

我们在工作中或者生活中或多或少都会讨论闭包函数内存泄漏的问题,那什么是内存泄漏呢?内存泄漏就是:对象内存不能被浏览器回收,或者说没有被浏览器回收。大家在考虑闭包是否浏览器回收的时候,随便考虑一下,随意的一个变量内存会被回收吗?我们学习以前先去看看FinalizationRegistry 内置API。


一个对象是否被回收
我们查看示例代码后会发现,obj根本没有被回收?那么说明对象没有在未知是否还没使用时,对象不会被浏览器主动回收。
let obj = {
  name: '5544554'
}
const cleanup = new FinalizationRegistry((key) => {
  console.log('内存回收', key);
})
cleanup.register(obj, 'obj');
我们现在查看该示例代码,当我们手动回收obj以后浏览器会回收清除该内存。
but.addEventListener('click', () => {
  obj = null; // 堆代码 duidaima.com
  console.log('点击');
});

let obj = {
  name: '5544554'
}
const cleanup = new FinalizationRegistry((key) => {
  console.log('内存回收', key); // 内存回收 obj
})
cleanup.register(obj, 'obj');
闭包函数
以下示例代码就是常见的最简单的闭包函数,那么我们就来看看他们是否会被浏览器回收。
function closure() {
  const obj = {
    id: 1,
    name: '张三'
  }
  return function () {
    return obj
  }
}
let fn = closure();
let b = fn();
根据以下代码我们静静的等待是否回触发内存回收,我们发现闭包跟普通的对象没有什么区别,在这个时候都不会触发浏览器回收机制。
function closure() {
  const obj = {
    id: 1,
    name: '张三'
  }
  return function () {
    return obj
  }
}
let fn = closure();
let b = fn();
const cleanup = new FinalizationRegistry((key) => {
  console.log('内存回收', key);
})
cleanup.register(b, 'b');
查看以下示例代码:我们手动去清除闭包函数的时候会发现,浏览器回收机制触发了(可能会等几秒中)。
but.addEventListener('click', () => {
  b = null;
  fn = null;
  console.log('点击');
})
总结
闭包不会导致内存泄漏,任意对象使用不到都可能会导致内存泄漏;所以我们不用担心闭包泄漏问题了,只要我们不瞎操作他就不会存在这个问题。
用户评论