手写防抖与节流函数深度解析
一句话概括 防抖(debounce)在高频事件停止后才执行一次,节流(throttle)让高频事件每隔固定时间最多执行一次——两者都是用”时间换性能”的思路,核心靠闭包保存定时器/时间戳来实现。面试手写这两道题,基础版 5 行搞定,但面试官真正想看的是你对 this 绑定、立即执行、取消机制这些边角的处理。 // 防抖:用户停止输入 500ms 后才发请求 const search = ...
一句话概括 防抖(debounce)在高频事件停止后才执行一次,节流(throttle)让高频事件每隔固定时间最多执行一次——两者都是用”时间换性能”的思路,核心靠闭包保存定时器/时间戳来实现。面试手写这两道题,基础版 5 行搞定,但面试官真正想看的是你对 this 绑定、立即执行、取消机制这些边角的处理。 // 防抖:用户停止输入 500ms 后才发请求 const search = ...
一句话概括 React Hooks 每次渲染都是一次全新的函数调用,闭包捕获的是当前渲染时的状态快照而非最新值。空依赖让闭包”冻结”在初始值上,定时器/事件监听/异步回调读到旧值的根源全在这。解法三条:函数式更新、正确声明依赖、useRef 穿透。 // ❌ 闭包陷阱:count 永远是 0 function Bug() { const [count, setCount] = use...
一句话概括 闭包的真正威力不是”能访问外部变量”,而是保存状态——防抖存定时器、模块存私有数据、柯里化存参数、记忆化存缓存,所有”函数带着数据跑”的模式,底层全是闭包。 // 闭包最核心的价值:函数 + 私有状态 function createCounter(init = 0) { let count = init; // ★ 状态被闭包保...
一句话概括 作用域决定了哪些变量在哪个范围内可以访问。JavaScript 有三种作用域——全局、函数、块级(let/const),变量查找时沿着作用域链从内向外逐层搜索。理解作用域是理解闭包、this、模块化的前提。 const global = "全局可见"; function outer() { const fnScoped = "outer 内部可见"; if (tr...
一句话概括 闭包 = 函数 + 它能访问的外部变量。当一个函数”记住”了它定义时所在的作用域,即使那个作用域已经执行完毕,这个函数仍然能访问里面的变量——这就是闭包。 function outer() { const a = 1; return function inner() { console.log(a); // inner 记住了 a }; } const...