使用场景
- debounce
- search搜索联想,用户在不断输入值时,用防抖来节约请求资源。
- 频繁操作点赞和取消点赞,因此需要获取最后一次操作结果并发送给服务器
- throttle
- 鼠标不断点击触发,mousedown(单位时间内只触发一次)
- indow触发resize的时候,不断的调整浏览器窗口大小会不断的触发这个事件,用防抖来让其只触发一次
函数
// 防抖
debounce(fn, wait=1000) {
let timeout;
return () => {
clearTimeout(timeout)
timeout = setTimeout(() => {
fn.call(this, arguments);
}, wait)
}
}
//节流
throttle(fn, wait=1000) {
let canRun = true;
return () => {
if (!canRun) return;
canRun = false;
setTimeout(() => {
fn.apply(this, arguments);
canRun = true;
}, wait);
};
}
在Vue中用法
searchInputCallback:tool.debounce(()=>{
console.log('sss')
})
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。