资讯专栏INFORMATION COLUMN

js函数节流和闭包

weknow619 / 3231人阅读

摘要:今天解决了一个小程序中函数节流的问题小记以下。定义一个函数函数里面定义一个变量返回一个匿名函数匿名函数里面操作这个变量使用的时候调用返回的匿名函数,可以用一个变量来接受一个简单的计数器代码如下

今天解决了一个小程序中函数节流的问题 小记以下。
节流 lodash中是throttle()那个函数,改天可以去研究下源码
下面是我自己实现的节流函数

  getClickTagFunc(){
     //定义一个标识,用来判断是否绕过下面匿名函数的判断
     let canRun = true
     //这个函数在onLoad()的时候就被调用
     //会返回一个匿名函数,这个匿名函数会被存在data里
     return function(id, isLiked){
        //匿名函数会在父作用域中去寻找canRun 如果是false 则不再执行下面的代码 return 掉
       if(!canRun) return false
       //绕过判断之后 立即把父作用域内的值设为false 这个是关键 由于canRun是false 所以200毫秒之内这个函数再被调用 就会直接被 return 掉
       canRun=false
        setTimeout(() => {
         
         dosomething......
         //做完想做的事情之后 把canRun设置为true 这样dosomething才会再次被调到。通常dosomething这里会是一个回调函数
         canRun=true
      
    }, 200)      
   }
}, 

节流简单点说就是稀释函数被调用的频率
然后还有一个就是闭包,之前一直不明白闭包要用在什么地方,今天算是初步弄明白了。可以让局部变量不被重置,通常来说 这是需要一个全局变量的。但是通过一个闭包也能完成。

1.定义一个函数
2.函数里面定义一个变量
3.返回一个匿名函数
4.匿名函数里面操作这个变量
5.使用的时候调用返回的匿名函数,可以用一个变量来接受

一个简单的计数器 代码如下

 function count(){
    let x = 0 
    return function(){
        console.log(x++) 
    }
}

let run = count()

setInterval(() => {
  run()
}, 200);

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/105559.html

相关文章

  • JS实现函数节流防抖

    摘要:函数的节流当持续触发事件时,保证一定时间段内只调用一次事件处理函数。也就是一个函数执行一次后,只有大于设定的执行周期后才会执行第二次。记忆法让函数执行者冷静下来后不一直抖动后,才真正执行。 1.函数的节流 当持续触发事件时,保证一定时间段内只调用一次事件处理函数。也就是一个函数执行一次后,只有大于设定的执行周期后才会执行第二次。记忆法:联系到水流的流量,我想让你1s只流出多少水你就只能...

    cnsworder 评论0 收藏0
  • JS实现函数节流防抖

    摘要:函数的节流当持续触发事件时,保证一定时间段内只调用一次事件处理函数。也就是一个函数执行一次后,只有大于设定的执行周期后才会执行第二次。记忆法让函数执行者冷静下来后不一直抖动后,才真正执行。 1.函数的节流 当持续触发事件时,保证一定时间段内只调用一次事件处理函数。也就是一个函数执行一次后,只有大于设定的执行周期后才会执行第二次。记忆法:联系到水流的流量,我想让你1s只流出多少水你就只能...

    浠ラ箍 评论0 收藏0
  • JS实现函数节流防抖

    摘要:函数的节流当持续触发事件时,保证一定时间段内只调用一次事件处理函数。也就是一个函数执行一次后,只有大于设定的执行周期后才会执行第二次。记忆法让函数执行者冷静下来后不一直抖动后,才真正执行。 1.函数的节流 当持续触发事件时,保证一定时间段内只调用一次事件处理函数。也就是一个函数执行一次后,只有大于设定的执行周期后才会执行第二次。记忆法:联系到水流的流量,我想让你1s只流出多少水你就只能...

    melody_lql 评论0 收藏0
  • 彻底弄懂函数防抖函数节流

    摘要:若时间差大于间隔时间,则立刻执行一次函数。不同点函数防抖,在一段连续操作结束后,处理回调,利用和实现。函数防抖关注一定时间连续触发的事件只在最后执行一次,而函数节流侧重于一段时间内只执行一次。 原博客地址,欢迎star 函数防抖和节流 函数防抖和函数节流:优化高频率执行js代码的一种手段,js中的一些事件如浏览器的resize、scroll,鼠标的mousemove、mouseover...

    Mr_houzi 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<