事件的防抖和节流主要是为了避免用户的重复操作引起浏览器的反复的回流和重绘。
防抖
所谓防抖就是，触发事件后，把触发非常频繁的时间合并成一次去执行。比如，在指定的时间内只执行一次回调函数，如果在指定的时间内又触发了该事件，则回调函数的执行时间会基于此刻重新开始计算。
实现方式：
var timer;
btnDom.onclick = () => {
timer && clearTimeout(timer)
timer = serTimeout(() => {
console.log('123')
})
}
或者
function deboun (delayTime) {
var timer
return () => {
timer && clearTimeout(timer)
timer = setTimeout(() => {
console.log('123')
}, arguments[0])
}
}
btnDom.onclick = deboun(3000)
实现的核心原理就是通过定义一个setTimeout的延时功能，在一定的时间内，如果我们多次的去触发这个事件，那么我们就先清除之前定义的延时器，然后重新去定义这个延时器；
节流
所谓的节流就是，频繁触发事件时，只会在指定的时间段内执行时间的回调，也就是说触发事件间隔大于等于指定时间才会执行回调函数。
实现方式：
function fn (delayTime) {
var _start = Date.now()
return () => {
var currentTime = Date.now()
var lockTime = arguments [0] - (currentTime - _start)
if (lockTime <= 0) {
console.log('开始执行')
} else {
console.log('稍后执行')
}
}
}
节流的实现方式也是利用 setTimeout 来实现，在一定的时间段内去执行某个方法，但是这种方式现在的应用场景很少，用的最多的还是事件的防抖，特别是涉及到购物和付账的业务，以及比如优惠券等等，在与后端交互的时候，用的比较多