防抖/节流（简单概括）

最新推荐文章于 2025-05-30 15:39:29 发布
最新推荐文章于 2025-05-30 15:39:29 发布
阅读量97 收藏
点赞数
文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/m0_71710542/article/details/126435793
版权

解决方式三种：时间戳，定时器（结合事件与箭头函数去操作），（第三种不太记得了）

 需要解决防抖与节流问题主要因为：很多时候因为用户操作过快或其他操作，导致触发事件过于频繁，则损耗性能。

解决方法：

防抖：只执行最后一次

节流：控制执行次数

 

昊98
关注
云从科技前端面试题及参考答案
大模型大数据攻城狮的专栏
02-11 399
在 HTML 中，元素可以分为块元素和内联元素，它们在页面布局和显示上具有不同的特点。块元素会在页面中独占一行，并且可以设置宽度和高度。即使为块元素设置的宽度小于其父元素的宽度，它也会独占一行，后续元素会被挤到下一行。常见的块元素有等。独占一行：块元素会自动换行，前后都会有换行符，使得每个块元素在页面中独立显示。可设置宽度和高度：可以通过 CSS 设置块元素的宽度和高度，也可以设置内边距、外边距和边框。宽度默认占满父元素。
前端面试汇总-React
越陌度阡
06-29 1292
React并不是将click事件绑定到了div的真实DOM上，而是在document处监听了所有的事件，当事件发生并且冒泡到document处的时候，React将事件内容封装并交由真正的处理函数运行。这样的方式不仅仅减少了内存的消耗，还能在组件挂在销毁时统一订阅和移除事件。除此之外，冒泡到document上的事件也不是原生的浏览器事件，而是由react自己实现的合成事件（SyntheticEvent）。因此如果不想要是事件冒泡的话应该调用event.preventDefault()方法，而不是调用event
节流和防抖
yanzi_0216的博客
06-06 305
节流和防抖 https://zhuanlan.zhihu.com/p/501685828 我之前一度不太理解节流和防抖之间的区别，老是容易把它们混为一谈 函数防抖（在上一个函数触发后的规定时间之内，再次触发函数，则会重新计时，也就是函数会被推迟触发，只有事件间隔内的最后一次触发事件才会执行）：将多次事件合并成了一个操作，本质上就是在维护一个延时器，规定在指定的时间后触发函数，但是如果在这个期间，事件被再次触发，就会取消之前的延时器从而重新计算时间，这样一来，实际上也就是只有最后一次事件才会执行。 函数节
防抖与节流，以及它们之间的区别
前端码农
09-02 250
防抖与节流，以及它们之间的区别
什么是防抖和节流？怎么实现？
qq_45651984的博客
07-14 879
什么是防抖和节流？怎么实现？
通俗理解防抖和节流
前端小师姐迪迪_的博客
07-08 757
答： 限制函数的执行次数 防抖和节流都是为了限制函数的执行次数，避免短时间不必要的多次函数执行答： 防止高频调用函数带来的性能损耗和卡顿；答： 防抖：连续多次触发事件，只执行最后一次 节流：n秒内多次触发事件，只执行一次答： 防抖： 1）search搜索联想时，用户在不断输入值时，搜索框下面自动补全搜索关键字（用防抖来实现当用户暂停连续输入时才处理用户输入的数据） 2）输入手机号，邮箱验证时输入字符的检测（用防抖来实现当用户暂停连续输入时才处理用户输入的数据）节流： 1）触底加载更多/滚动加载更多事件（用节
Vue - 使用Lodash实现防抖和节流
iotjin的专栏
02-08 1万+
Vue - 使用Lodash实现防抖和节流
防抖和节流
weixin_52398973的博客
03-15 152
加入防抖的效果大家是可以预见的，它抑制住了高频操作，此时用户持续输入，并在 1s 内重新输入时是不会触发打印操作的，核心就在这个 1s 内，如果用户停止输入并超过 1s ,则会执行打印。说的通俗点就是：你尽管频繁触发事件，但我一定是在触发事件的n秒后才执行，如果在前一个事件触发的n秒内又重新触发了这个事件，那就以新的事件的时间为准，n 秒后才执行。运行上面代码，可以看到每次释放键盘时控制台都在打印，频率很高，但因为要执行的操作只是简单的打印，所以感受不到性能的消耗。事件，每次释放键盘时打印输入值，我们。
一文理解防抖与节流
zxdznyy的博客
08-08 1375
防抖与节流是前端面试的重难考点。希望在这篇博客我能把这两个概念讲清楚。当事件触发后，延迟几秒后再执行回调。如果在这n秒内事件又被触发，则重新计时，是不是会清晰许多。频繁触发，只触发一次综合上述实例，我们在玩游戏时英雄会有一定的技能冷却时间，从而减少了一段时间内事件的触发频率，而节流的理解则是减少事件的触发频率，有选择性执行一部分事件。这里先再次重复一下两者定义：防抖： 当事件触发后，延迟n秒后再执行回调，如果在这n秒内时间再次被触发，则重新计时。...
防抖和节流,有什么区别？
热门推荐
weixin_67651040的博客
03-17 2万+
1.防抖(debounce)： 防抖触发高频率事件时n秒后只会执行一次，如果n秒内再次触发，则会重新计算。 简单概括：每次触发时都会取消之前的延时调用。 2.节流(thorttle): 高频事件触发，每次触发事件时设置一个延迟调用方法，并且取消之前延时 调用的方法。 简单概括：每次触发事件时都会判断是否等待执行的延时函数。 防抖和节流本质是不一样的。防抖是将多次执行变为最后一次执行，节流是将 多次执行变成每隔一段事件执行 区别：降低回调执行频率，节省计算资源。
温故而知新，详细讲讲JavaScript的防抖与节流
共同学习，共同成长
07-05 2978
今天给大家详细讲讲JavaScript的防抖与节流，包含二者的区别与优缺点、使用场景，并提供具体代码帮助大家深入理解，彻底掌握！
什么是防抖和节流？有什么区别？如何实现及使用场景？
qq_57334853的博客
07-22 441
防抖和节流常见面试题、有的面试官甚至让手写防抖和节流？其重要性就不必多说了。 一句话概括就是：通过控制事件触发频率达到优化函数执行效率的效果
Vue详解知识概括
begefefsef的博客
07-31 824
我们在html文件上输入【!】叹号(在英文状态下)，然后按键盘的【Tab】键，只有在这种情况下按住Tab键可以快速创建一个html模板。代码缩进时只缩进两个空格。开发快捷键①Ctrl+p查找文件全局搜索字符串③Ctrl+j切换终端④Ctrl+b显示/隐藏左侧目录栏显示所有命令⑥拆分当前编辑窗口Ctrl+，Ctrl+1234等在编辑窗口间切换⑦选中方法名->Shift+F12，选中方法名->鼠标右键插件src目录分析②。...
JavaScript知识点全面概括与总结(中)
BayMin0-0的博客
03-23 321
61.cookie的理解 cookie 是服务器提供的一种用于维护会话状态信息的数据，通过服务器发送到浏览器，浏览器保存在本地，当下一次有同源的请求时，将保存的 cookie 值添加到请求头部，发送给服务端。这可以用来实现记录用户登录状态等功能。cookie 一般可以存储 4k 大小的数据，并且只能够被同源的网页所共享访问。 服务器端可以使用 Set-Cookie 的响应头部来配置 cookie 信息。一条cookie 包括了5个属性值 expires、domain、path、secure、HttpOnl
国芯思辰| 国产四通道24位生理电采集模拟前端AFE全面替换ADS1294R，心电贴性能再飞跃
weixin_38427020的博客
05-29 565
国芯思辰，国产芯片替代
vue组件和插件的区别
u014642921的博客
05-28 450
只要有install方法并且接受Vue构造函数作为参数，就能够被Vue.use使用。可以是第三方库，也可以是自己编写的组件。
el-table-column如何获取行数据的值
LoveYouQueena的博客
05-29 548
一旦你获取到了当前行的数据，就可以根据需要进行后续的操作或展示，比如删除、编辑当前行的数据等。的模板中定义一个按钮，并为该按钮添加一个点击事件处理器。在Vue 2.x中，你可以使用。属性（在Vue 3.x中）来获取当前行的数据。点击事件处理器会接收到一个参数（在Vue 2.x中是。如果你使用的是Vue 3.x，代码将略有不同，主要是将。中获取当前行的数据，并通过点击事件处理器进行后续操作。在Vue 3.x中，则使用。），该参数包含了当前行的数据。属性（在Vue 2.x中）或者。，在Vue 3.x中也是。
优雅草最新实战项目技术Discuz X3.5电子签约插件开发项目实施方案优雅草·卓伊凡
一颗优雅草科技-央千澈的优快云博客~只想无穷无尽的学习~作息早8-晚8
05-27 1400
优雅草科技将为DiscuzX3.5系统开发电子签约插件，预算9,300元，工期35天。项目采用PHP7.4+e签宝SDK技术栈，实现合同发起、签署、模板管理等功能。包含UI设计、前端开发（响应式页面）、后端插件开发及文档培训。技术方案重点包括：集成e签宝API，新建签约记录数据表，开发后台管理界面，并确保与Discuz原生系统无缝集成。项目采用模块化开发，优先保障核心签约流程，提供3个月维护期。
网易 - 灵犀办公文档
最新发布
葡萄城技术团队博客
05-30 369
网易 - 灵犀办公文档
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值