js 中有哪几种内存泄露的情况

在JavaScript中，以下是几种常见的内存泄露情况：

1. 全局变量
   • 解释：当在全局作用域中定义变量，并且没有手动释放它们时，可能会导致内存泄露。在浏览器环境中，全局对象是window，如果不小心将大量数据挂载到window对象上，这些数据在页面关闭前都不会被垃圾回收机制（Garbage Collection，GC）自动回收。
   • 示例：

     function createGlobalVariable() {
            
     window.largeData = new Array(1000).fill('data');
     }
     createGlobalVariable();
     // 这里的largeData一直存在于全局作用域中，直到页面关闭
     

2. 闭包
   • 解释：闭包是指有权访问另一个函数作用域中变量的函数。如果在闭包中引用了包含函数的this、arguments或者外部函数的变量，并且这个闭包一直存在（例如被存储在一个全局变量中或者作为一个DOM事件处理函数），那么被引用的变量也不会被垃圾回收。因为JavaScript的垃圾回收机制是基于引用计数的，只要闭包对外部变量存在引用，这些变量就不会被回收。
   • 示例：

     function outerFunction() {
            
     let data = 'I am data';
     return function innerFunction() {
            
        console.log(data);
     };
     }
     let closureFunction = outerFunction();
     // 这里的closureFunction是一个闭包，它引用了outerFunction中的data变量
     // 只要closureFunction存在，data变量就不会被回收
     

3. DOM元素引用
   • 解释：在JavaScript中，当把DOM元素存储在一个变量或者数据结构中，并且忘记在元素从DOM树中移除后清除这个引用时，就会发生内存泄露。因为DOM元素本身占用内存，并且如果它还关联了一些事件处理函数等，这些相关的资源也不会被释放。
   • 示例：

     let element = document.getElementById('some - element');
     function someFunction() {
            
     // 在这里进行一些操作，但是没有清除element的引用
     }
     // 假设'some - element'从DOM树中被移除了，但是element变量仍然引用它
     

4. 定时器和回调函数
   • 解释：如果在定时器（setTimeout、setInterval）或者其他异步回调函数（例如Promise的then方法中的回调）中引用了外部变量，并且没有正确地清理定时器或者回调，那么这些引用的变量可能不会被回收。因为只要定时器或者回调函数在等待执行，它们所引用的变量就会一直保留在内存中。
   • 示例：

     function leakyTimer() {
            
     let data = 'Timer data';
     setInterval(() => {
            
        console.log(data);
     }, 1000);
     }
     leakyTimer();
     // 这里的setInterval中的回调函数一直引用data变量，即使leakyTimer函数执行完毕，data也不会被回收
     

5. 事件监听器
   • 解释：当在DOM元素上添加事件监听器时，如果没有在适当的时候移除这些监听器，就会导致内存泄露。例如，当一个DOM节点被移除时，它上面绑定的事件监听器如果没有被移除，仍然会保留在内存中，并且可能会导致对已经不存在的DOM元素的引用，从而阻止垃圾回收。
   • 示例：

     let button = document.createElement('button');
     function handleClick() {
            
     console.log('Button clicked');
     }
     button.addEventListener('click', handleClick);
     // 假设button从DOM树中被移除了，但是没有移除click事件监听器
     // 这样handleClick函数和对button的引用可能会导致内存泄露