Javascript基础:实现防抖函数(debounce)

   日期:2020-12-19     浏览:104    评论:0    
核心提示:一、实现防抖函数防抖函数原理:在事件被触发n秒后再执⾏回调,如果在这n秒内⼜被触发,则重新计时。⼿写简化版:// 防抖函数 const debounce = (fn, delay) => { let timer = null; return (...args) => { clearTimeout(timer); timer = setTimeout(() => { fn.apply(this, args); }, delay);

一、实现防抖函数

防抖函数原理:在事件被触发n秒后再执⾏回调,如果在这n秒内⼜被触发,则重新计时。

手写简化版:

// 防抖函数 
const debounce = (fn, delay) => {  
					let timer = null; 
					return (...args) => {  
						clearTimeout(timer); 
						timer = setTimeout(() => {  fn.apply(this, args); }, delay); 
						}; 
				};

适⽤场景:

  • 按钮提交场景:防⽌多次提交按钮,只执⾏最后提交的⼀次 。
  • 服务端验证场景:表单验证需要服务端配合,只执⾏⼀段连续的输⼊事件的最后⼀次,还有搜索联想词功能类似 。

补充:(生存环境请用lodash.debounce)

 
打赏
 本文转载自:网络 
所有权利归属于原作者,如文章来源标示错误或侵犯了您的权利请联系微信13520258486
更多>最近资讯中心
更多>最新资讯中心
0相关评论

推荐图文
推荐资讯中心
点击排行
最新信息
新手指南
采购商服务
供应商服务
交易安全
关注我们
手机网站:
新浪微博:
微信关注:

13520258486

周一至周五 9:00-18:00
(其他时间联系在线客服)

24小时在线客服