节流:(规定时间内只出发一次,规定时间内再次触发则无效
代码实现:通过鼠标移入事件 num++
let num = 0
let content = document.getElementById('box')
function count() {
content.innerHTML = num++
}
//节流
// 两种 第一种 setTimeout
function throttle(func,delay) {
let timeOut=null //定义一个定时器句柄
return function(){
if(!timeOut){ //是否存在定时器
timeOut=setTimeout(()=>{ //创建一个定时器
timeOut=null
func.apply(this,arguments)
},delay)
}
}
}
//时间戳
function throtitle(func,delay){
let prev=0;//上次记录的时间
return function(){
let now=Date.now() //当前的时间
if(now-prev>delay){ //如果当前时间大于等待时间
func.apply(this) //执行函数
prev=now //重置上次记录时间
}
}
}
content.onmousemove = throttle(count, 2000)