节流和防抖


防抖

防抖:动作绑定事件,动作发生一定时间后触发事件,在这段时间内,如果该动作又发生,则重新等待一段时间后再触发事件。(触发会重新等待一段时间再触发事件)

function debounce(func, time) {
  let timer = null;
  return () => {
    clearTimeout(timer);
    timer = setTimeout(() => {
      func.apply(this, arguments);
    }, time);
  };
}

节流

节流:动作绑定事件,动作发生后一段时间后触发事件,在这段时间内,如果该动作又发生,则无视该动作,直到事件执行完后,才能重新触发。(等待一定的时间后才会重新触发)

function throtte(func, time) {
  let activeTime = 0;
  return () => {
    const current = Date.now();
    if (current - activeTime > time) {
      func.apply(this, arguments);
      activeTime = Date.now();
    }
  };
}

文章作者:   leader755
版权声明:   本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 leader755 !
评论
 上一篇
vue通信-组件传值 vue通信-组件传值
前言:1>在介绍组件传值之前先明确三种组件关系:父子组件、兄弟组件、无关系组件。如上图所示: 父子关系:A 和 B、B 和 C、B 和 D 都是父子关系; 兄弟关系:C 和 D 是兄弟关系, 无关系:A 和 C、A 和 D 是隔代关
2021-04-15
下一篇 
Element表单验证 Element表单验证
1>常规验证和自定义验证1.element-ui 中的表单校验要加验证之前一定要确保已经写了 prop 属性,该属性是跟 rule 绑定在一起的,也可以在行内单独制定 rules。 方式一: 常规写法 el-from :rules
2021-03-06
  目录