对象方法赋值后this丢失的根本原因是函数调用时才确定this，解决关键是提前锁定或重建上下文：bind显式绑定、箭头函数包装、类字段箭头函数、调用时临时bind。
对象方法赋值给独立变量后 this 蜕变为默认绑定，根本原因是函数调用时才确定 this，而赋值只是复制函数引用，不携带上下文。解决的关键不是“阻止丢失”，而是“提前锁定或重建上下文”。
用 bind 显式绑定 this
在赋值时就固定 this 指向原对象，是最直接、语义最清晰的方式：
- const fn = obj.method.bind(obj); —— 调用 fn() 时 this 始终是 obj
- 适用于需要多次复用该绑定函数的场景，比如传给事件监听器或定时器
- 注意：bind 返回的是新函数，原函数不变；每次 bind 都生成新函数，避免在循环中反复 bind
改用箭头函数包装
利用箭头函数不绑定自身 this、而是继承外层词法作用域的特点：
- const fn = () => obj.method(); —— 调用 fn() 相当于手动以 obj 为上下文执行
- 适合一次性使用或逻辑简单的情况，写法轻量
- 缺点：无法被重用为通用工具函数（因为硬编码了 obj），且不能用 new 调用
类字段 + 箭头函数（类组件常用）
在 class 中定义方法时直接用箭头函数语法，从定义阶段就切断 this 的动态性：
- class MyClass { handleClick = () => { console.log(this.value); } }
- 实例化后，this.handleClick 是绑定好的函数，赋值或传参都不会丢失 this
- 依赖类字段提案（已广泛支持），本质是构造函数中自动绑定，无需手动干预
调用时临时绑定（适用回调场景）
不提前保存函数，而在实际调用点恢复上下文：
- btn.addEventListener('click', obj.method.bind(obj));
- setTimeout(() => obj.method(), 100); 或 setTimeout(obj.method, 100) 改为 setTimeout(obj.method.bind(obj), 100)
- 适合事件、定时器、Promise 回调等一次性场景，避免提前创建多余函数
