关键在于防抖/节流函数需在闭包中捕获this和参数，并通过fn.apply(this, args)准确转发；定时器回调不可用箭头函数或直接fn()，react中还需清理定时器并校验实例有效性。
关键在于每次调用时，把当前执行环境的 this 和实际传入的参数完整、准确地交给原函数。
防抖函数里怎么传 this 和参数
防抖的核心是“清旧启新”，但新定时器里的回调必须知道是谁调的、带了什么数据。最稳妥的方式是：在返回的闭包函数中捕获 this 和 arguments（或用 rest 参数），再通过 fn.apply(this, args) 转交。
- 别直接写
fn()—— 会丢失上下文，this变成全局或undefined（严格模式） - 避免用箭头函数包裹定时器回调 —— 箭头函数不绑定
this，它继承外层作用域，而外层是防抖函数本身，不是调用者 - 推荐用
fn.apply(this, args)，兼容任意参数个数，且明确指定上下文 - 如果用 ES6 rest 参数（
...args），记得调用时也用fn(...args)，但要注意 apply 更通用、兼容性更好
节流函数同样要捕获并转发
节流无论用时间戳法还是定时器法，只要内部有异步执行（比如 setTimeout），就存在上下文丢失风险。和防抖一样，需在闭包内保存当前 this 和参数，在真正执行时还原。
- 时间戳版：在判断可执行时，立刻用
fn.apply(context, args)，而不是先存再调 - 定时器版：在
setTimeout回调里，同样用apply，不能只写fn() - 如果用
bind预绑定，容易导致每次调用都生成新函数，影响性能且不利于清理（比如 React 中无法精准清除）
React 或类组件里还要注意卸载安全
组件销毁时，若防抖/节流定时器还在跑，this 可能已失效，强行调用会报错或内存泄漏。
- 在 useEffect 清理函数中 clearTimeout / 清空 timerId
- 执行前加一层校验：
if (!thisRef || !thisRef.current) return（配合 useRef 存实例） - 避免在定时器回调里直接访问 class 实例属性，优先通过参数传值
一个最小可靠示例（防抖）
// 正确传递 this 和参数，支持任意调用方式
function debounce(fn, delay) {
let timer = null;
return function (...args) {
const context = this;
clearTimeout(timer);
timer = setTimeout(() => {
fn.apply(context, args);
}, delay);
};
}
这样写，不管它是 obj.method()、eventListener 绑定，还是 bind 过的函数，都能正确还原原始调用现场。
