美文网首页web前端
防抖和节流的区别

防抖和节流的区别

作者: 姜治宇 | 来源:发表于2020-04-20 22:22 被阅读0次

防抖和节流,这俩哥们无论声音相貌长得都非常像,就像孪生兄弟一般,有时候难免混为一谈。但实际上这俩哥们确实有不太一样的地方,这里我们就详细聊一下。
防抖,英文是debounce,bounce是弹跳的意思,de就是否定,debounce就是别瞎几把跳,翻译成文明用语就是防抖。
那到底什么是跳跳(抖动)呢?
比如你在百度搜索框输入内容,然后弹出联想词。弹出联想词一般是你在输入完成后再过一会执行的,翻译成程序语言就是:keyup事件结束后一段时间(n秒)才触发,如果n秒内keyup事件又发生了,就重新计算时间。
用一句话概括为:将多次执行变为最后一次执行
那什么是节流呢?
比如你去高铁排队过安检,当人流高峰期时,一般会有个人拿个牌子,一次只放一部分人进去,这样做就是为了防止一段时间人流过大导致踩踏现象;再比如QQ网页版,当你上线后,你的好友是一部分一部分加载出来的,如果一下子加载所有的好友(比如几百个),那浏览器内存很容易被dom给撑死,但一次加载一部分就没事,因此我们用程序语言描述就是:某事件高频触发,但在 n 秒内只会执行一次,这样就会稀释函数的执行频率。
用一句话概括为:将多次执行变成每隔一段时间执行

相关文章

  • 函数节流与函数防抖

    函数节流与函数防抖的区别JS魔法堂:函数节流(throttle)与函数去抖(debounce)函数的防抖与节流 自...

  • 关于防抖和节流的区别和实现

    对于“防抖”和“节流”,之前以为这两个词是一个概念,翻了几篇文章特此写笔记整理一下。 防抖和节流的区别 防抖是.....

  • 13.防抖与节流

    防抖和节流的一个明显区别就是:一次执行后,防抖可再次执行时间是动态的,节流可再次执行时间是固定的。 防抖 每次事件...

  • 谈谈js中的节流和防抖函数

    关于节流和防抖,这篇文章说的很好了,深入lodash源码分析防抖和节流深入篇 | Lodash 防抖和节流是怎么实...

  • 防抖和节流的区别

    防抖和节流,这俩哥们无论声音相貌长得都非常像,就像孪生兄弟一般,有时候难免混为一谈。但实际上这俩哥们确实有不太一样...

  • JavaScript防抖和节流

    1. 认识防抖和节流 1.1. 对防抖和节流的认识 防抖和节流的概念其实最早并不是出现在软件工程中,防抖是出现在电...

  • 防抖和节流

    防抖和节流的区别, 防抖是把多次操作合并成一个触发执行节流相当于开水龙头,水大了关小,一段时间执行一次 防抖 延迟...

  • 函数防抖防抖/节流

    众所周知,函数节流和函数防抖都是优化高频率执行js代码的一种方法,二者的区别及使用方法如下: 函数节流 函数防抖,...

  • 前端常见面试题(十五)@郝晨光

    什么是函数防抖和函数节流?有什么区别? 概念 函数防抖 函数防抖,就是指触发事件后在 n 秒内函数只能执行一次,如...

  • 2019-03-27

    js的防抖和节流 据我所知防抖和节流都是为了优化作用,减轻浏览器和服务端的负担,防抖和节流俩个的英文要记住: de...

网友评论

    本文标题:防抖和节流的区别

    本文链接:https://www.haomeiwen.com/subject/kzcsihtx.html