函数防抖实现

158 阅读1分钟

函数防抖定义:触发高频事件,在指定时间内函数只会执行一次,如果指定时间内高频事件再次被触发,则耗时从新开始计算

code implements

html code:

  <input id="root" type="text" />

js code:

  function debounce(fn) {
            let time = null;
            return function () {
                if (time) {clearTimeout(time); }
                time = setTimeout(() => {
                    fn.call(this);  //>= 吧input的this绑定到当前函数fn上
                }, 500);
            }
    }

  function sayOk() {
         console.log("fangdou success");
   }

  const ele = document.getElementById("root");
  ele.addEventListener("input", debounce(sayOk))