
在网上查到的简单的防抖函数实现是这样的,试了一下确实可以实现防抖,但是我没搞明白多次调用函数每次 timer 不是都会新建一个并赋值为 0 吗?为什么可以把 timer 做为判断标志?
const debounce = (func, wait = 50) => { let timer = 0 return function(...args) { if (timer) clearTimeout(timer) timer = setTimeout(() => { func.apply(this, args) }, wait) } } 1 cxe2v 2021-11-05 10:21:17 +08:00 你使用这个 debounce 的时候,是不是这样 ``` funcA = debounce(yourfunction,100) ``` 这一步将 yourfunction 加入了防抖函数的内部,然后你调用是调用的 funcA ,当 funcA 被调用时,实际上你是在执行 ``` function(...args) { if (timer) clearTimeout(timer) timer = setTimeout(() => { func.apply(this, args) }, wait) } ``` 你注意这里的 timer ,就是同一个 timer |
2 lalalaqwer 2021-11-05 10:21:21 +08:00 闭包 你可以看作每次 debounce 的调用都会创建一个空间出来,里面有一个 timer ,后面你调用的是 debounce 返回的那个函数,那个函数就把 debounce 创建的空间内的 timer 当作判断标志。 |
3 loading 2021-11-05 10:55:45 +08:00 |
4 cwp374240920 2021-11-05 11:03:49 +08:00 via Android 你用的是他 return 出来的函数,不是防抖包的这个函数 |
5 2i2Re2PLMaDnghL 2021-11-05 11:04:53 +08:00 在 SICP 应该是第一章里的基本操 新建 timer 的时间是在调用 debounce 的时候,而不是调用 func 的时候。 |
6 letwewell 2021-11-05 11:30:21 +08:00 debounce 只调用一次。 使用闭包返回的函数才是多次执行的 |
7 MarkLazy 2021-11-05 13:51:09 +08:00 via Android 闭包 |
8 Curtion 2021-11-05 14:06:38 +08:00 debounce 函数只会调一次,需要做防抖的函数应该是 func |
9 94 2021-11-05 14:15:23 +08:00 闭包原理,所以你后续执行的其实只是 return 出来的匿名函数,其中的 timer 是闭包的父级变量。 function(...args) { if (timer) clearTimeout(timer) timer = setTimeout(() => { func.apply(this, args) }, wait) } |
10 Gaays OP |
11 Kasumi20 2021-11-05 17:51:16 +08:00 怎么拿到返回值,我觉得应该加入 Promise 来实现 |