标签：事件 搜索 pre input框 用户 return set span listen
最近在面试的时候有一面试题是关于防抖节流的，回来加强了一下，做以下总结，希望对大家有所帮助！
先来说一下防抖和节流的应用场景
防抖 - debounce：
1、input框输入时，可以使用防抖节约资源的请求，比如搜索框
2、window触发resize时，当用户停止改变窗口的大小时，再触发事件
节流 - throttle：
1、 scroll滚动事件
2、鼠标不断点击，mouseover事件等
下面用一个scroll事件，来实现以下节流和防抖吧
// 防抖 function debounce(fn,wait) { var timeout = null return function() { if(timeout !== null) clearTimeout(timeout) timeout = setTimeout(fn,wait) } } function handle() { console.log(Math.floor(Math.random()*100)) } window.addEventListener(‘scroll‘,debounce(handle,1000))
//节流 function throttle(func,delay) { var timer = null return function() { var that= this var args = arguments // 定时器不存在时，触发一个定时器，回调中清除定时器 if(!timer) { timer = setTimeout(() => { func.apply(that,args) timer = null }, delay); } } } function func() { console.log(parseInt(Math.random()*100)) } window.addEventListener(‘scroll‘,throttle(func,1000))
标签：事件 搜索 pre input框 用户 return set span listen
原文地址：https://www.cnblogs.com/linhongjie/p/11980246.html
