在定时器中正确访问外层变量需利用闭包机制，优先用const声明+箭头函数继承this，避免var提升问题；需“快照”值时应提前缓存变量；务必清理定时器防止内存泄漏。
在定时器（如 setTimeout 或 setInterval）中正确访问外层作用域变量，关键在于理解 JavaScript 的闭包机制和 this 绑定问题。常见错误是直接在回调中使用 this 或未捕获的局部变量，导致取值为 undefined 或指向错误对象。
用闭包自动捕获变量
函数声明或箭头函数会形成闭包，自然保留对定义时所在作用域中变量的引用：
- 普通函数表达式能访问外层
let/const变量（块级作用域），无需额外处理 - 推荐优先使用
const声明变量，避免被意外修改 - 避免用
var，因其变量提升可能导致意料之外的值
示例：
const count = 5;setTimeout(() => {
console.log(count); // 正确输出 5
}, 100);
处理 this 指向问题
定时器回调中的 this 默认指向全局对象（非严格模式下是 window，严格模式下是 undefined），不是外层函数的 this：
立即学习“Java免费学习笔记（深入）”；
- 用箭头函数：自动继承外层函数的
this - 用
bind(this)显式绑定 - 提前缓存
const self = this，在回调中使用self
示例（类方法中）：
class Timer {constructor() {
this.msg = 'Hello';
}
start() {
// ✅ 推荐：箭头函数
setTimeout(() => console.log(this.msg), 100);
// ✅ 或 bind
setTimeout(function() { console.log(this.msg); }.bind(this), 200);
}
}
注意变量变化带来的“过期值”问题
如果外层变量在定时器触发前被重新赋值，回调拿到的是最新值，而非设置定时器那一刻的值：
- 需要“快照”语义时，把变量作为参数传入
setTimeout（它会按值拷贝基本类型） - 对引用类型（如对象、数组），可结构赋值或浅拷贝（
{...obj}）来隔离
示例：
let id = 1;setTimeout(() => console.log(id), 100); // 输出 2（因下面立即改了值）
id = 2;
// ✅ 要固定为 1，应：
const idAtTime = 1;
setTimeout(() => console.log(idAtTime), 100);
清理定时器避免内存泄漏和逻辑错乱
尤其在组件卸载、异步操作取消等场景，不清理定时器会导致回调执行时访问已销毁的变量或 this：
- 保存定时器 ID（
const timerId = setTimeout(...)） - 在适当时机调用
clearTimeout(timerId)或clearInterval(timerId) - React 中可在
useEffect清理函数里清除；Vue 中可在beforeUnmount钩子中处理
不复杂但容易忽略。
