JavaScript节流应用相当广泛,一般我们可能会直接用某些函数库的实现,比如lodash、underscore 等。下面我们具体探究下节流的核心
节流
先执行一次,然后在满足某些条件后才能再次触发
下面是一个简单的代码实现
var throlle = function(fn, delay) {
var timer = null;
return function() {
var that = this;
if (timer) {
return;
}
var args = arguments;
fn.apply(that, args);
timer = setTimeout(function(){
clearTimeout(timer);
timer = null;
}, delay || 300);
}
}
var btn = document.createElement('button');
btn.innerHTML = 'clicked me !';
var clickedHandle = throlle(function(a){console.log(a);}, 1000)
btn.onclick = function() {
clickedHandle('3232');
}
document.body.appendChild(btn);
希望能对大家有所帮助