为什么要讲这个话题呢?主要是因为最近很多问题都由这个特性帮我解决了,让我感叹这非常有用。
学习英语是理解编程的第一步。de-
在英语里表示 xx 的反义,比如 defrost(除霜),deactivate(使失活),decentralization(权力分散),那么 debounce 的意思就是防抖/防止弹跳。我们结合实际的例子感性的认识一下。
比如,我们在一个循环语句中,有个函数我只想执行一次。
for (let i = 0; i < 30; i++) {
console.log(i);
say(i,i);// 爱就一个字,我只想说一次。
}
那怎么做呢?我们先看 debounce 都实现。
function debounce(fn, timeout) {
let timeId;
return (...args) => {
clearTimeout(timeId);
timeId = setTimeout(() => {
fn.apply(null, args);
}, timeout);
};
}
实现起来很简单,借助 setTimeout 就能搞定。say 函数的实现就是这样的:
let say = debounce(function (a,b) {
console.log(a,b);
}, 0);
把上面的代码合并起来就是完整可以运行的代码。我们在实际项目中可以参考 lodash 等第三方的实现,功能更强大。好啦,今天就分享那么多。