关于节流函数

关于节流函数

export const debounce = (func, delay = 200) => {
 let timer = null;

 return function (...args) {
   timer && clearTimeout(timer);
   timer = setTimeout(() => {
     func.apply(this, args);
   }, delay);
 };
};
在每次执行debounce的时候都会let timer = null,那么在第二次在200ms的时间间隔里,debounce函数执行,先是将timer设为null,,然后判断timer为false就不会执行后面的cleartimeout了啊,,那下面重新设置一个定时器也就没有意义,那这个是怎么运行机制呢

正在回答

登陆购买课程后可参与讨论,去登陆

3回答

同学你好,是的。

祝学习愉快~

好帮手慕糖 2020-01-05 15:40:58

同学你好,1、同学截的这个图只是个声明的图,后面没有括号,但是在使用这个方法的时候,后面是有括号的,如下。添加括号调用了。这个是调用debounce这个函数的时候,传递的匿名函数。

http://img1.sycdn.imooc.com//climg/5e1190b209db735f04690155.jpg

2、返回的是个函数,但是这个函数在输入内容的时候触发了。输入的时候query的值改变了,这个值改变的时候,就会触发监听事件,所以里面的函数也就执行了。

可以带着这个理解,结合课程的代码再听下视频理解下哦。

祝学习愉快~

  • 提问者 慕用0863198 #1
    也就是说在watch中query改变的时候执行的其实是debounce返回的函数对象
    2020-01-05 16:15:42
好帮手慕星星 2020-01-04 18:38:43

同学你好,理解的有点问题。

debounce方法后面加了括号,是自调用的,所以query后面的方法是返回的函数,也就是这个

http://img1.sycdn.imooc.com//climg/5e106af109b4065803730161.jpg

debounce自调用只会执行一次,那么timer也就会初始化一次。当输入框内容改变的时候,执行的是返回的函数。

如果我的回答帮助到了你,欢迎采纳,祝学习愉快~

  • 提问者 慕用0863198 #1
    在源码中,……debounce后面没有加括号,不是直接返回一个函数嘛,在watch直接调用也是将一个匿名函数传进去,没有看出有自调用的地方。 问一下撒,自调用的形式是什么,因为只了解过自执行函数,自调用是指在第一次调用之后,后面再使用这个函数就只是执行这个函数的返回值嘛?
    2020-01-04 21:51:26
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星

相似问题

登录后可查看更多问答,登录/注册

热门框架Vue开发WebApp 18版
  • 参与学习           人
  • 提交作业       209    份
  • 解答问题       3299    个

本路径是通过ES6基础知识、运用Zepto、Swiper、fullPag等移动端常用工具包、以及当下流行框架Vue,结合多个实战案例,还原真实开发场景,最终实现手机端购物商城网页开发。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师