对象方法中返回普通函数会导致this丢失，解决方案有：①用箭头函数继承外层this；②用const self = this保存上下文；③用bind显式绑定；④直接返回箭头函数（外层须为普通函数）。
在对象字面量的方法里定义普通函数并返回它，这个函数一旦脱离原对象调用，this 就会丢失，降级为全局对象（或 undefined），这是常见又隐蔽的问题。关键不在于“避免嵌套”，而在于切断“普通函数独立调用”与“原对象上下文”的断裂。
用箭头函数替代普通嵌套函数
箭头函数没有自己的 this，它直接继承外层普通函数的 this 值，且该绑定发生在定义时（词法绑定），不会因调用方式改变。
- 外层必须是具有明确 this 的普通函数（如对象方法），不能是箭头函数或全局作用域
- 适合定时器、事件回调、异步操作等场景
示例：
const obj = { name: 'Bob', getData() { return () => console.log(this.name); } }; const fn = obj.getData(); fn(); // 正确输出 "Bob"
显式保存 this 到变量（如 self / that）
在方法起始处用 const self = this 捕获当前上下文，闭包内统一使用 self 访问属性和方法。
- 兼容性好，适用于所有环境（包括需支持旧版浏览器的项目）
- 变量名建议用
self或that，避免与作用域内其他变量冲突 - 注意：不能用
var声明，否则可能受函数提升影响；推荐const或let
示例：
const obj = { name: 'Bob', getData() { const self = this; return function() { console.log(self.name); }; } }; const fn = obj.getData(); fn(); // 输出 "Bob"用 bind 显式绑定 this
在返回闭包前，用 .bind(this) 把函数的 this 永久锁定为目标对象。
- 适合需要返回可复用、带固定上下文的函数的场景
- 每次调用都会生成新函数，注意内存开销（一般可忽略）
- 比箭头函数更明确地表达了“意图”，便于他人理解
示例：
const obj = { name: 'Bob', getData() { return function() { console.log(this.name); }.bind(this); } }; const fn = obj.getData(); fn(); // 输出 "Bob"直接返回箭头函数（不包裹在普通函数内）
如果不需要复用外层逻辑，最简方式是让方法本身返回箭头函数，省去一层嵌套。
- 写法最轻量，语义清晰
- 适用于简单数据获取、状态快照等一次性用途
- 注意：不能用于需要动态参数传递或复杂初始化的场景
示例：
const obj = { name: 'Bob', getData: () => () => console.log(this.name) }; // ❌ 错误：外层是箭头函数，this 是全局的const obj2 = { name: 'Bob', getData() { return () => console.log(this.name); } }; // ✅ 正确
