- 场景:用户多次点击一个按钮频率过高时,这个点击事件需要传递参数。
- 通过函数节流的方式减少触发的频率。
- 代码如下:
<button class="btn">点击按钮</button>
var btn = document.getElementsByClassName('btn')[0]
btn.onclick = throttle(handelClick('123'),2000,['1','2','3'])
function handelClick(params1,params2,params3){
console.log('传递的参数-',params1,params2,params3) //传递的参数-1 2 3
}
/*
callback函数
wait毫秒内重复点击只会执行一次
params 函数中需要传递的参数
*/
function throttle(callback, wait , params) {
var lastTime = 0;
return function () {
var nowTime = new Date().getTime();
if (nowTime - lastTime > wait) {
// parms需要传递的参数[]
callback.apply(this,params);
lastTime = nowTime;
}
}
}
学习阶段,如有不对和不足,欢迎大家交流。