原生js实现防抖
- 什么是防抖
- 防抖表示当指定时间内持续触发某个事件时,该事件会进行初始刷新,重新开始计算。
let btn = document.querySelector('button');
function write(){
console.log('已经成功实现防抖');
}
const fd = function(fn,deplay){
let timer;
return function(){
const that = this;
const arg = arguments;
clearTimeout(timer);
timer = setTimeout(function(){
fn.apply(that,arg)
},deplay)
}
}
btn.addEventListener('click',fd(write ,1000));
原生js实现节流
- 什么是节流 ?
节流当指定时间持续触发某个事件时,该事件只会执行首次触发事件,也就是说指定时间内只会触发一次。
const btn = document.querySelector('button');
function write() {
console.log('这是节流');
}
const jl = function (fn, deplay) {
let timer;
return function () {
let content = this;
let ar = arguments;
if (timer) {
return;
}
timer = setTimeout(function () {
fn.apply(content, arguments);
timer = null;
}, deplay);
}
}
btn.addEventListener('click', jl(write, 1000));