一、防抖(debounce)
const title = document.getElementById('title')
function debounce(fn, delay = 500) {
let timer = null
return function () {
if(timer)clearTimeout(timer)
timer = setTimeout(()=>{
fn.apply(this, arguments)
timer = null
}, delay)
}
}
title.addEventListener('keyup', debounce(function (){
console.log(this.value)
}, 500))
二、节流(throttle)
const div1 = document.getElementById('div1')
function throttle(fn, delay = 100) {
let timer = null
return function () {
if(timer){
return
}
timer = setTimeout(()=>{
fn.apply(this, arguments)
timer = null
}, delay)
}
}
div1.addEventListener('drag', throttle(function(e){
console.log(e.offsetX, e.offsetX)
},200))