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

前端面试题:节流和防抖

节流和防抖都是通过降低事件执行的频率而达到节省资源的效果

节流

一段时间只执行一次,多少秒之后获取验证码、resize 事件和scroll 事件等

类似王者荣耀中的传送,一段时间内只能传送一次,具体实现如下:

function throttle(fn, delay) {let lastTime = 0;return function () {let currentTime = Date.now();if (currentTime - lastTime > delay) {lastTime = currentTime;fn.apply(this, arguments);}};
}

防抖

一段时间内连续触发事件,只执行最后一次,如搜索,手机号、邮箱地址的校验

类似王者荣耀中的回城操作,如果被打断则重新计时,不打断则执行最后一次操作。

代码实现如下:

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

具体应用实现如下:

&

相关文章:

前端面试题:节流和防抖

节流和防抖都是通过降低事件执行的频率而达到节省资源的效果 节流 一段时间只执行一次,多少秒之后获取验证码、resize 事件和scroll 事件等 类似王者荣耀中的传送,一段时间内只能传送一次,具体实现如下: function throttle(fn, delay) {let lastTime = 0;return functi…...

网络工程师学习笔记——交换机路由器 数据传输

交换机和路由器是数据通信最核心,也是所有网工最熟悉的设备。今天学习:交换机%路由器数据传输过程。 目录 一、交换机 1、交换机原理 2、交换机数据传输过程 3、交换机基本原理配置命令 二、路由器 1、路由器原理 2、路由器数据传输过程 3、静态…...

【论文笔记】A Survey on 3D Gaussian Splatting

原文链接:https://arxiv.org/abs/2401.03890 1. 引言 NeRF在计算效率和可控性上具有局限性,这导致了3D高斯溅射(3D GS)的出现,重新定义了场景表达和渲染。 3D GS通过引入新的场景表达技术,用大量的3D高斯…...

项目实战————苍穹外卖(DAY11)

苍穹外卖-day11 课程内容 Apache ECharts 营业额统计 用户统计 订单统计 销量排名Top10 功能实现:数据统计 数据统计效果图: 1. Apache ECharts 1.1 介绍 Apache ECharts 是一款基于 Javascript 的数据可视化图表库,提供直观&#x…...

非常好用的Mac清理工具CleanMyMac X 4.14.7 如何取消您对CleanMyMac X的年度订购

CleanMyMac X 4.14.7是Mac平台上的一款非常著名同时非常好用的Mac清理工具。全方位扫描您的Mac系统,让垃圾无处藏身,您只需要轻松单击2次鼠标左键即可清理数G的垃圾,就这么简单。瞬间提升您Mac速度。 CleanMyMac X 4.14.7下载地址&#xff1a…...

【51单片机系列】proteus仿真单片机的串口通信

本文参考:https://zhuanlan.zhihu.com/p/425809292。 在proteus之外使用串口软件和单片机通信。通过在proteus设计一个单片机接收PC发送的数据,并将接收的数据发送出去,利用软件【Configure Virtual Serial Port Driver】创建一对虚拟串口&am…...

【Qt】对象树与坐标系

需要云服务器等云产品来学习Linux的同学可以移步/-->腾讯云<--/-->阿里云<--/-->华为云<--/官网&#xff0c;轻量型云服务器低至112元/年&#xff0c;新用户首次下单享超低折扣。 目录 一、Qt Creator快捷键 二、对象树 1、对象树的析构 2、自定义类的编写…...

【设计模式】腾讯二面:自动贩卖机/音频播放器使用了什么设计模式?

状态模式是什么&#xff1f; 状态模式&#xff0c;也被称作状态对象模式&#xff0c;是一种行为设计模式。 当一个对象的内在状态改变时&#xff0c;允许改变其行为&#xff0c;这个对象看起来像是改变了其类。 它让对象在其内部状态改变时改变自己的行为。外部调用者无需了…...

转换操作符转换类型:普通函数指针(普通函数、类的静态函数)、类的成员函数指针

一、转换操作符的定义 转换操作符是一种特殊的类成员函数 &#xff0c;它定义将类类型值转变为其他类型值的转换&#xff0c;转换操作符在类定义体内声明&#xff0c;在保留字operator之后跟着转换的目标类型&#xff0c;转换函数采用如下通用形式&#xff1a; operator type(…...

易控智驾高精度地图开发工程师校招一面、二面面经

本文介绍2024届秋招中&#xff0c;北京易控智驾科技有限公司的高精度地图开发工程师岗位的2场面试基本情况、提问问题等。 12月投递了北京易控智驾科技有限公司的高精度地图开发工程师岗位&#xff0c;所在部门暂不清楚。目前完成了一面、二面流程&#xff0c;在这里记录一下2场…...

用VSCode玩STM32的烧录工具 CooCox Cortex Flash Programmer

一、下载软件 经热心兄弟推荐的版本&#xff0c;不知道有没有版权&#xff0c;如有版权问题&#xff0c;请通知删除。 CSDN - 0积分下载&#xff1a;https://download.csdn.net/download/qq_49053936/88744187 二、生成bin文件 插件不同&#xff0c;方法有所不同&#xff0c;各…...

Pycharm无法刷新远程解释器的框架: Can‘t get remote credentials for deployment server

在Pycharm上部署项目到远程服务器&#xff0c;有时候需要启动SSH会话&#xff0c;启动的时候发现没反应&#xff0c;且事件日志显示&#xff1a;无法刷新远程解释器的框架: Can’t get remote credentials for deployment server 观察pycharm界面最下边&#xff0c;发现“无默…...

c++设计模式之单例模式

介绍 一个类无论创建多少对象&#xff0c;都只能得到一个实例 A* p1new A(); A* p2new A(); A* p3new A(); 如上述代码中&#xff0c;我们通过new运算符创建出了类A的三个对象实例&#xff0c;而我们现在要做的是&#xff0c;如何设计类A&#xff0c;使得上述代码运行之后永远…...

Git学习笔记(第5章):Git团队协作机制

目录 5.1 团队内协作 5.2 跨团队协作 Git进行版本控制都是在本地库操作的。若想使用Git进行团队协作&#xff0c;就必须借助代码托管中心。 5.1 团队内协作 问题引入&#xff1a;成员1&#xff08;大佬&#xff09;利用Git在宿主机上初始化本地库&#xff0c;完成代码的整体…...

Python 面向对象绘图(Matplotlib篇-16)

Python 面向对象绘图(Matplotlib篇-16)         🍹博主 侯小啾 感谢您的支持与信赖。☀️ 🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ�…...

Linux开机自动挂载window密码有转义字符的共享文件夹

项目上遇到需要自动挂载windows共享盘到linux系统中&#xff0c;由于windows密码有英文逗号(,)&#xff0c;被linux识别成了参数分隔符&#xff0c;在网上找了很多办法都不行&#xff0c;后来通过这种方式完美解决&#xff0c;linux系统是centos8.4文章阅读操作时间在5分钟左右…...

Redis(四)

1、Redis的单/多线程 1.1、单线程 其实直接说Redis什么单线程或者是多线程&#xff0c;不太准确&#xff0c;在redis的4.0版主之前是单线程&#xff0c;然后在之后的版本中redis的渐渐改为多线程。 Redis是单线程主要是指Redis的网络IO和键值对读写是由一个线程来完成的&#…...

一文解读ISO26262安全标准:术语

一文解读ISO26262安全标准&#xff1a;术语 做汽车行业的人&#xff0c;都知道安全标准ISO26262&#xff0c;但是仔细说说它到底讲的是什么&#xff1f;好像又说不出来&#xff0c;这是个玄之又玄的话题&#xff0c;笔者试图将这份标准以简明扼要、并且容易理解的形式梳理出来&…...

使用stable diffussion插件StableSR将图片高清放大

一&#xff1a;需要安装的插件 1、StableSR&#xff0c;项目地址&#xff1a;https://github.com/pkuliyi2015/sd-webui-stablesr 不过国内没什么用&#xff0c;访问不了&#xff0c;可以用下面的国内镜像&#xff1a; https://gitee.com/han51535/sd-webui-stablesr.git 这…...

ActiveMQ:专注消息传递,助您构建高效稳定的系统

在数字化世界的今天&#xff0c;应用程序和系统之间的通信变得日益重要&#xff0c;为了确保数据能够在不同的服务和组件之间高效、可靠地传输&#xff0c;消息队列技术应运而生。 Apache ActiveMQ 作为一种流行的开源消息队列技术&#xff0c;为企业级应用提供了强大的支持&am…...

KubeSphere 容器平台高可用:环境搭建与可视化操作指南

Linux_k8s篇 欢迎来到Linux的世界&#xff0c;看笔记好好学多敲多打&#xff0c;每个人都是大神&#xff01; 题目&#xff1a;KubeSphere 容器平台高可用&#xff1a;环境搭建与可视化操作指南 版本号: 1.0,0 作者: 老王要学习 日期: 2025.06.05 适用环境: Ubuntu22 文档说…...

Spark 之 入门讲解详细版(1)

1、简介 1.1 Spark简介 Spark是加州大学伯克利分校AMP实验室&#xff08;Algorithms, Machines, and People Lab&#xff09;开发通用内存并行计算框架。Spark在2013年6月进入Apache成为孵化项目&#xff0c;8个月后成为Apache顶级项目&#xff0c;速度之快足见过人之处&…...

Spring Boot 实现流式响应(兼容 2.7.x)

在实际开发中&#xff0c;我们可能会遇到一些流式数据处理的场景&#xff0c;比如接收来自上游接口的 Server-Sent Events&#xff08;SSE&#xff09; 或 流式 JSON 内容&#xff0c;并将其原样中转给前端页面或客户端。这种情况下&#xff0c;传统的 RestTemplate 缓存机制会…...

.Net框架,除了EF还有很多很多......

文章目录 1. 引言2. Dapper2.1 概述与设计原理2.2 核心功能与代码示例基本查询多映射查询存储过程调用 2.3 性能优化原理2.4 适用场景 3. NHibernate3.1 概述与架构设计3.2 映射配置示例Fluent映射XML映射 3.3 查询示例HQL查询Criteria APILINQ提供程序 3.4 高级特性3.5 适用场…...

无法与IP建立连接,未能下载VSCode服务器

如题&#xff0c;在远程连接服务器的时候突然遇到了这个提示。 查阅了一圈&#xff0c;发现是VSCode版本自动更新惹的祸&#xff01;&#xff01;&#xff01; 在VSCode的帮助->关于这里发现前几天VSCode自动更新了&#xff0c;我的版本号变成了1.100.3 才导致了远程连接出…...

【JVM】- 内存结构

引言 JVM&#xff1a;Java Virtual Machine 定义&#xff1a;Java虚拟机&#xff0c;Java二进制字节码的运行环境好处&#xff1a; 一次编写&#xff0c;到处运行自动内存管理&#xff0c;垃圾回收的功能数组下标越界检查&#xff08;会抛异常&#xff0c;不会覆盖到其他代码…...

Neo4j 集群管理:原理、技术与最佳实践深度解析

Neo4j 的集群技术是其企业级高可用性、可扩展性和容错能力的核心。通过深入分析官方文档,本文将系统阐述其集群管理的核心原理、关键技术、实用技巧和行业最佳实践。 Neo4j 的 Causal Clustering 架构提供了一个强大而灵活的基石,用于构建高可用、可扩展且一致的图数据库服务…...

2025盘古石杯决赛【手机取证】

前言 第三届盘古石杯国际电子数据取证大赛决赛 最后一题没有解出来&#xff0c;实在找不到&#xff0c;希望有大佬教一下我。 还有就会议时间&#xff0c;我感觉不是图片时间&#xff0c;因为在电脑看到是其他时间用老会议系统开的会。 手机取证 1、分析鸿蒙手机检材&#x…...

自然语言处理——Transformer

自然语言处理——Transformer 自注意力机制多头注意力机制Transformer 虽然循环神经网络可以对具有序列特性的数据非常有效&#xff0c;它能挖掘数据中的时序信息以及语义信息&#xff0c;但是它有一个很大的缺陷——很难并行化。 我们可以考虑用CNN来替代RNN&#xff0c;但是…...

Unity | AmplifyShaderEditor插件基础(第七集:平面波动shader)

目录 一、&#x1f44b;&#x1f3fb;前言 二、&#x1f608;sinx波动的基本原理 三、&#x1f608;波动起来 1.sinx节点介绍 2.vertexPosition 3.集成Vector3 a.节点Append b.连起来 4.波动起来 a.波动的原理 b.时间节点 c.sinx的处理 四、&#x1f30a;波动优化…...