在我们处理js事件时，有些事件我们可能不需要持续性的出发，像mousemove，resize，keyup，scroll等，有时候我们只需要连续的触发只执行一次即可。
lodash debounce not working in anonymous function
最显而易见的场景，有时候我们的会在input框输入文字，这时候需要向服务器发出ajax请求，我们连续的输入会触发很多次的请求。比如我们连续快速的输入"hello world"向服务器进行请求。
那么请求次数为11次，即每次输入都会触发一次。同样我们对屏幕的滚动或者手机的滑动操作也不是真正的每有一点点的scroll就触发事件。
所以，我们这里用到debounce来处理。debounce的原理就是加一个延时，在连续的输入过去一定的时间才执行一次事件处理操作。
有很多相关的文章写的很好可以参考。
JS魔法堂：函数节流（throttle）与函数去抖（debounce）
实例解析防抖动（Debouncing）和节流阀（Throttling）
而且在underscore和lodash里都有相关的实现可以直接调用。
这里使用主要是在ng2-ckeditor里用到了debounce，在项目里使用ckeditor里快速输入一些文字在快速的点击保存时，输入的内容存不进去，这里就是因为debounce的原因，如果点击保存太快，delay时间还没到，也就是ckeditor的绑定还没执行，所以内容还没有绑定到模型。
有时候用debounce也得看具体的需要，有些地方可能不需要。
Clarity里string filter加debounce（server driven）
lodash debounce not working in anonymous function
使用refresh
然后给refresh加debounce
注意这里debounce的返回函数赋值给一个变量然后refresh直接调用，如果加到匿名函数里是不起作用
网友评论