当前位置: 首页 > news >正文

js节流和防抖

节流(throttle)和防抖(debounce)是为了解决函数频繁触发而引发性能问题的两种优化方法。

节流: 指定一个时间间隔,在时间间隔内只执行一次函数,即在一段时间内,多次触发函数只执行一次。常见的应用场景如页面滚动、窗口大小调整等。

示例代码:

function throttle(fn, delay) {let timer = null;return function () {const context = this;const args = arguments;if (!timer) {timer = setTimeout(() => {fn.apply(context, args);timer = null;}, delay);}};
}

防抖: 指定一个时间间隔,在该时间间隔内重复触发函数时,只执行最后一次。常见的应用场景如输入框输入、搜索框输入等。

示例代码:

function debounce(fn, delay) {let timer = null;return function () {const context = this;const args = arguments;clearTimeout(timer);timer = setTimeout(() => {fn.apply(context, args);}, delay);};
}

http://www.lryc.cn/news/207464.html

相关文章:

  • 权限系统设计(转载)
  • 【机器学习合集】标准化与池化合集 ->(个人学习记录笔记)
  • Dockerfile文件自动化生成R4L镜像
  • 基于SSM的居家养老系统
  • [C#基础训练]FoodRobot食品管理部分代码-2
  • docker部署rabbitmq的坑
  • 【python VS vba(系列2)】 python和vba读写EXCEL文件的方式比较 (建设ing)
  • 小程序 swiper滑动 层叠滑动效果
  • 【20年VIO梳理】
  • Java Object类详解
  • Unity 中忽略图片透明度的 Image 组件的修改版本
  • hibernate源码(1)--- schema创建
  • 数学与经济管理
  • 自动化测试系列 —— UI自动化测试
  • 眨个眼就学会了PixiJS
  • WORD中的表格内容回车行距过大无法调整行距
  • MySQL 高级函数整理
  • UG\NX二次开发 连接曲线、连结曲线 UF_CURVE_auto_join_curves
  • python爬虫入门(四)爬取猫眼电影排行(使用requests库和正则表达式)
  • Mybatis-Plus CRUD
  • 【强化学习】08——规划与学习(采样方法|决策时规划)
  • (链表) 25. K 个一组翻转链表 ——【Leetcode每日一题】
  • VisualStudio[WPF/.NET]基于CommunityToolkit.Mvvm架构开发
  • 深度学习_5_模型拟合_梯度下降原理
  • 大模型时代,AI如何成为数实融合的驱动力?
  • MS COCO数据集的评价标准以及不同指标的选择推荐(AP、mAP、MS COCO、AR、@、0.5、0.75、1、目标检测、评价指标)
  • css实现鼠标多样化
  • 21.2 Python 使用Scapy实现端口探测
  • Qt设计一个自定义的登录框窗口
  • 05 MIT线性代数-转置,置换,向量空间Transposes, permutations, spaces