欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 科技 > 能源 > JavaScript 中的防抖和节流(简易版)

JavaScript 中的防抖和节流(简易版)

2024/10/24 2:14:14 来源:https://blog.csdn.net/m0_63306944/article/details/143128263  浏览:    关键词:JavaScript 中的防抖和节流(简易版)

防抖:类似于王者荣耀里的回城。

节流:类似于王者荣耀里的放技能。

防抖

防抖是指事件被触发后等待一定的延迟时间,若在这期间再次触发了事件,则重新开始计算延迟时间,只有当延迟时间结束后才会执行函数。(这段描述就是代码的逻辑)

function debounce(func, wait) {let timeout = null;return function (...args) {const context = this;clearTimeout(timeout);timeout = setTimeout(() => {func.apply(context, args);}, wait);};
}

节流 

节流是指在规定的时间内,不管触发多少次事件,函数只会执行一次。(这段描述就是代码的逻辑)

function throttle(func, wait) {let inThrottle = false;return function (...args) {const context = this;if (!inThrottle) {func.apply(context, args);inThrottle = true;setTimeout(() => {inThrottle = false;}, wait);}};
}

总结

  • 防抖:类似于王者荣耀里的回城,如果在回城过程中被打断了,就要重新点击回城。
  • 节流:类似于王者荣耀里的放技能,释放了当前技能,技能会处于冷却期,无法点击。 

注:个人理解,仅供参考。

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com