1. 未清理的定时器
如果页面中存在大量的定时器，且这些定时器没有被正确清理，就会导致内存泄漏。
问题描述
比如当页面被销毁或组件被卸载时，若没有做清理定时器的操作，那定时器会仍然在运行，它会持有对回调函数的引用，阻止回调函数及其依赖的变量被垃圾回收。
这种情况在单页面应用中尤为常见，因为页面的某些部分可能会频繁地加载和卸载。
示例
javascript
function setupTimer() {
setTimeout(() => {
console.log('This will still run even if the component is unmounted');
}, 1000);
}
// 在组件加载时调用
setupTimer();
// 组件卸载时没有清理定时器解决方法
在组件或页面卸载时，使用 clearTimeout 及时清理定时器。
javascript
let timerId;
function setupTimer() {
timerId = setTimeout(() => {
console.log('This will run only if the component is still mounted');
}, 1000);
}
function cleanupTimer() {
clearTimeout(timerId); // 清理定时器
}
// 在组件加载时调用
setupTimer();
// 在组件卸载时调用
cleanupTimer();2. 回调函数中的闭包
如果回调函数中使用了闭包，可能会导致定时器一直占据着某个引用的外部变量，这个变量可能是一个大体积量的数据，或是一个大型 DOM 元素，这回阻止这些数据被垃圾回收。
问题描述
注意，闭包的一个特性就是，在闭包内部引用的外部变量不会被垃圾回收机制回收。
但是，使用闭包 ≠ 导致内存泄漏。
然而，如果加上定时器，这样频繁的执行闭包函数，那么这个外部变量相当于一直被引用，若它是个大体积量数据，则会一直占据内存，导致内存泄漏。
示例
javascript
function setupTimer() {
const largeData = new Array(1000000).fill('data'); // 大型数据
setTimeout(() => {
console.log(largeData.length); // 回调函数中引用了 largeData
}, 1000);
}
setupTimer();解决方法
减少闭包中的引用：尽量减少回调函数中对大型对象或不必要的变量的引用。
使用弱引用 ：如果可能，使用 WeakMap 或 WeakSet 来存储对对象的引用，避免阻止垃圾回收。
3. 重复设置定时器
如果在短时间内多次调用 setTimeout，可能会导致定时器数量不断增加，占用大量内存。
javascript
window.addEventListener('scroll', () => {
setTimeout(() => {
console.log('Scroll event');
}, 100);
});解决方法
使用防抖（Debounce）或节流（Throttle）：通过防抖或节流技术，限制事件处理函数的调用频率，避免频繁设置定时器。
及时清理旧的定时器：在设置新的定时器之前，先清理旧的定时器。
javascript
let scrollTimer;
window.addEventListener('scroll', () => {
clearTimeout(scrollTimer); // 清理旧的定时器
scrollTimer = setTimeout(() => {
console.log('Scroll event');
}, 100);
});4. 定时器使用的 DOM 元素被移除但未手动清理定时器
如果定时器的回调函数引用某个 DOM 元素变量，且这个 DOM 元素变量是在外部定义的。
若该 DOM 元素已经被移除，但定时器仍然存在，可能会由于闭包导致内存泄漏。
这实际上还是因为通过闭包访问了外部 dom 元素变量导致的内存泄露。
示例
javascript
const element = document.createElement('div');
document.body.appendChild(element);
setTimeout(() => {
console.log(element); // 回调函数中引用了 element
}, 1000);
document.body.removeChild(element); // 移除 DOM 元素解决方法
清理定时器：在移除 DOM 元素时，手动清理相关的定时器。
引用 dom 时在函数内部重新定义并获取 dom：在回调函数中，通过选择器重新获取 DOM 元素，而不是直接引用外部变量，即阻止了闭包的引用。
javascript
const element = document.createElement('div');
document.body.appendChild(element);
let timerId = setTimeout(() => {
const currentElement = document.querySelector('div'); // 重新获取 DOM 元素
if (currentElement) {
console.log(currentElement);
}
}, 1000);
document.body.removeChild(element); // 移除 DOM 元素
clearTimeout(timerId); // 清理定时器总结
定时器导致的内存泄露的风险，主要是和定时器未及时清理，调用多个定时器，以及定时器内部使用了闭包等相关。