setTimeout回调中this指向window或undefined是默认绑定规则所致；可通过箭头函数继承外层this、bind提前绑定、闭包缓存self/that、启用严格模式等方式主动控制。

在 setTimeout 的回调里，this 指向 window（非严格模式）或 undefined（严格模式），不是 bug，而是 JavaScript 默认绑定规则的自然结果：回调函数被“裸调用”，脱离了原对象上下文。关键不是阻止它发生，而是主动控制执行时的 this。

用箭头函数继承外层 this

箭头函数不绑定自己的 this，而是沿用定义时所在词法作用域的 this 值，通常就是你期望的对象实例。

• 适合类方法、Vue 组件 methods、React 类组件等场景
• 写法简洁：setTimeout(() => { console.log(this.name); }, 1000);
• 注意：不能用于需要动态 this 的场景（比如事件处理器需指向 DOM 元素）

提前 bind 绑定固定上下文

在初始化阶段就锁定 this，生成一个始终指向目标对象的稳定函数引用。

• 类中常用：this.handleClick = this.handleClick.bind(this);，再传给 setTimeout 或事件监听器
• 也可在调用时临时绑定：setTimeout(this.method.bind(this), 1000);
• 优点是语义明确、兼容性好；缺点是每次 bind 都创建新函数

闭包缓存 this 引用

用变量（如 const self = this; 或 const that = this;）在外部捕获当前 this，让回调通过闭包访问。

• 写法直观，老项目中常见：const self = this; setTimeout(function() { console.log(self.name); }, 1000);
• 适用于不能用箭头函数的环境（如需支持 IE）
• 注意变量命名清晰，避免和全局变量冲突

启用严格模式提前暴露问题

加 "use strict"; 不会修复 this，但能让错误更早浮现——this.xxx 直接报 TypeError，而不是静默读到 window.xxx 的错误值。

• 建议整个文件或函数顶部开启
• 配合 ESLint 规则（如 no-invalid-this）进一步约束
• 它是“安全哨兵”，不是解决方案本身