这个知识点看过好多遍了,总感觉似懂非懂的感觉,参考了好几篇文章,总结一下方便日后查看复习。
先直接看代码:
防抖函数:
function debounce (fun, time) {
var timer;
return function () {
clearTimeout(timer);
timer = setTimeout(function () {
fun.apply(this, arguments);
}, time);
}
}
节流函数:
function throttle (fun,time) {
var t1 = 0;
return function(){
var t2 = new Date();
if (t2 - t1 > time) {
fun.apply(this, arguments);
t1 = t2;
}
}
}
防抖:在不断的操作中(输入、点击等)最终只执行一次的一种提高性能的方法。
节流:一段时间内不断操作而在你规定的时间内只执行一次的一种提高性能的方法。
对于防抖和节流一个最主观的判断方法就是:
在10s内你疯狂点击一个按钮,如果使用了防抖则会只执行一次,而你使用了节流则会每隔一段时间执行一次,这个时间可以自己来掌控。