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

js中的定时器 setTimeout()和setInterval()

JavaScript 定时器,有时也称为“计时器”,用来在经过指定的时间后执行某些任务,类似于我们生活中的闹钟。

在 JavaScript 中,我们可以利用定时器来延迟执行某些代码,或者以固定的时间间隔重复执行某些代码。例如,您可以使用定时器定时更新页面中的广告或者显示一个实时的时钟等。

JavaScript 中提供了两种方式来设置定时器,分别是 setTimeout() setInterval(),它们之间的区别如下:

方法作用
setTimeout()在指定的时间后(单位为毫秒),执行某些代码,代码只会执行一次
setInterval()按照指定的周期(单位为毫秒)来重复执行某些代码,定时器不会自动停止,除非调用 clearInterval() 函数来手动停止或着关闭浏览器窗口

具体介绍如下:

setTimeout()

常用语法:

// 单次定时器,只能执行一次
setTimeout(function () { },time);// - 参数1:function 必需。函数,过time时间之后执行的业务逻辑,可写成箭头函数()=>{}的形式// - 参数2:time 可选。执行或调用 function 需要等待的时间,以毫秒ms计。默认为 0// 清除setTimeout单次定时器
clearTimeout(定时器名称);

注意事项:time 取默认值 0 时意味着“马上”执行,或者尽快执行。不管是哪种情况,实际的延迟时间可能会比期待的 (time 毫秒数) 值长。

实际延时比设定值更久的原因:最小延迟时间

在浏览器中,setTimeout()/setInterval()的每调用一次定时器的最小间隔4ms,这通常是由于函数嵌套导致(嵌套层级达到一定深度5层),或者是由于已经执行的 setInterval 的回调函数阻塞导致的,不同浏览器中出现这种最小延迟的情况有所不同

setInterval()

常用语法:

// 循环定时器,不停歇,每过一段时间time,执行一次。setInterval(function () { },time);
// 参数同setTimeout// 清除setInterval循环定时器
clearInterval(定时器名称);

setTimeout() 和 setInterval()中的调用函数我们也称为回调函数 callback 普通函数是按照代码顺序直接调用。 而这个函数,需要等待时间,时间到了才去调用这个函数,因此称为回调函数。

延迟限制:定时器是可以嵌套的;这意味着,setInterval()的回调中可以嵌入对 setInterval() 的调用以创建另一个定时器,即使第一个定时器还在运行。为了减轻这对性能产生的潜在影响,一旦定时器嵌套超过 5 层深度,浏览器将自动强制设置定时器的最小时间间隔为 4 毫秒。如果尝试将深层嵌套中调用 setInterval()的延迟设定为小于 4 毫秒的值,其将被固定为 4 毫秒。

相关文章:

js中的定时器 setTimeout()和setInterval()

JavaScript 定时器,有时也称为“计时器”,用来在经过指定的时间后执行某些任务,类似于我们生活中的闹钟。 在 JavaScript 中,我们可以利用定时器来延迟执行某些代码,或者以固定的时间间隔重复执行某些代码。例如&…...

【吃透Js】深入学习浅拷贝和深拷贝

一、JavaScript数据类型原始类型对象类型二、原始类型和对象类型的区别1.原始类型2.引用类型3.复制4.比较5.值传递三、浅拷贝概念实现方法四、深拷贝概念五、浅拷贝、深拷贝和赋值的区别浅拷贝和赋值六、小结想要真正搞明白深浅拷贝,你必须要熟练掌握赋值、对象在内…...

AUTOSAR为啥要开发新的社区商业模式?

总目录链接>> AutoSAR入门和实战系列总目录 文章目录1 自适应平台架构中的集群更新1.1 ara::diag 服务(诊断)更新1.2 信号到服务映射和自动驾驶接口让我们讨论一下信号到服务映射服务:Automated Driving Interface:2 车载应用商店概念本文介绍Re…...

数据结构和算法面试常见题必考以及前端面试题

1.数据结构和算法 1.1 反转单向链表 public class Node {public int value;public Node next; }public Node reverseList(Node head) {Node pre null;Node next null;while (head ! null) {next head.next;head.next pre;pre head;head head.next}return pre; }1.2 在顺…...

一文解决Python所有报错

前言 Python是一种强大的编程语言,但是它也有一些报错,这些报错可能会让你感到困惑。本文将介绍如何解决Python中的常见报错。 首先,让我们来看看Python中最常见的报错:SyntaxError。这种报错表明你的代码中有语法错误&#xff0c…...

LeetCode 1237. Find Positive Integer Solution for a Given Equation【双指针,二分,交互】

本文属于「征服LeetCode」系列文章之一,这一系列正式开始于2021/08/12。由于LeetCode上部分题目有锁,本系列将至少持续到刷完所有无锁题之日为止;由于LeetCode还在不断地创建新题,本系列的终止日期可能是永远。在这一系列刷题文章…...

【C语言】结构体进阶

一、结构体 1. 结构体的声明 (1) 结构的基础知识 结构是一些值的集合,这些值称为成员变量。结构的每个成员可以是不同类型的变量。(2)结构的声明 struct tag {member-list; }variable-list;例如描述一个学生&#x…...

全志T3+FPGA国产核心板——Pango Design Suite的FPGA程序加载固化

本文主要基于紫光同创Pango Design Suite(PDS)开发软件,演示FPGA程序的加载、固化,以及程序编译等方法。适用的开发环境为Windows 7/10 64bit。 测试板卡为全志T3+Logos FPGA核心板,它是一款基于全志科技T3四核ARM Cortex-A7处理器 + 紫光同创Logos PGL25G/PGL50G FPGA设计…...

深度学习之 imgaug (图像增强)学习笔记

深度学习之 imgaug (图像增强)前言1\. 安装和卸载2\. 示例2.1 基本使用2.2 包含常用的变换示例3 Augmenters常用函数3.1 iaa.Sequential()3.2 iaa.someOf()3.3 iaa.OneOf()3.4 iaa.Sometimes()3.5 iaa.WithColorspace()3.6 iaa.WithChannels()3.7 iaa.No…...

mysql字符串等值查询中条件字段值末尾有空格也能查到数据问题

一、事故还原 我们仍然使用学生信息表,但是我们只需要保留两个字段即可: CREATE TABLE student_info (id int(11) NOT NULL AUTO_INCREMENT COMMENT 学号,name varchar(20) CHARACTER SET utf8 DEFAULT NULL COMMENT 姓名, PRIMARY KEY (id) ) ENGINEIn…...

一个关于事件溯源Event Sourcing的小荔枝,Golang实现

最后更新于2023年3月1日 10:23:13 参考的这个文章:https://martinfowler.com/eaaDev/EventSourcing.html 用C sharp实现的,我改写成Golang了 最简单的例子 func main() {eProc : NewEventProcessor()//refact : Cargo{Name: "Refactoring"}…...

Vue3 组合式函数,实现minxins

截至目前,组合式函数应该是在VUE 3应用程序中组织业务逻辑最佳的方法。它让我们可以把一些小块的通用逻辑进行抽离、复用,使我们的代码更易于编写、阅读和维护。 一. 什么是“组合式函数”? 根据官方文档说明,在 Vue 应用的概念中…...

什么是钉钉消息推送?

我是3y,一年CRUD经验用十年的markdown程序员👨🏻‍💻常年被誉为职业八股文选手 在前阵子我就已经接入了钉钉的群机器人和工作消息推送,一直没写文章同步到给大家。 像这种接入渠道的工作,虽然我没接入过&…...

利用 NVIDIATAO 和 WeightBias 加速AI开发

利用 NVIDIATAO 和 Weight&Bias 加速AI开发 利用图像分类、对象检测、自动语音识别 (ASR) 和其他形式的 AI 可以推动公司和商业部门内部的大规模转型。 然而,从头开始构建人工智能和深度学习模型是一项艰巨的任务。 构建这些模型的一个共同先决条件是拥有大量高…...

token - 令牌

文章目录token - 令牌学前须知:1,base64 防君子不防小人2,SHA-256 安全散列算法的一种(hash)3,HMAC-SHA2564,RSA256 非对称加密2.1 JWT - json-web-token1,三大组成2,jwt…...

应用模型开发指南上新介绍

Module、HAP、Ability、AbilitySta-ge、Context……您是否曾经被这些搞不懂又绕不开的知识点困扰? 现在,全新的《应用程序包基础知识》及《应用模型开发指南》为您答疑解惑! 这里有您关注的概念解析、原理机制阐述,也有丰富的…...

Dbeaver连接Hive数据库操作指导

背景:由于工作需要,当前分析研究的数据基于Hadoop的Hive数据库中,且Hadoop服务端无权限进行操作且使用安全模式,在研究了Dbeaver、Squirrel和Hue三种连接Hive的工具,在无法绕开useKey认证的情况下,只能使用…...

【RabbitMQ笔记09】消息队列RabbitMQ之常见方法的使用

这篇文章,主要介绍消息队列RabbitMQ之常见方法的使用。 目录 一、消息队列常见方法 1.1、连接工厂ConnectionFactory 1.2、连接Connection 1.3、通道Channel 1.4、交换机相关方法 (1)exchangeDeclare()声明交换机 1.5、队列相关方法 …...

Linux字符设备驱动模型之设备号

从上文中可知,在Linux用户空间中,如若需要操作硬件设备,均通过/dev目录下的设备文件节点进行操作,基本上每一种设备都会存在一个或者多个的设备节点。 并且在Linux内核中,其表示字符设备的结构成员也提供了相应的设备号…...

C++多态原理

请看下面的程序&#xff0c;该程序演示了多态类对象存储空间的大小。 #include <iostream> using namespace std; class A {public:int i;virtual void func() {}virtual void func2() {} }; class B : public A {int j;void func() {} }; int main() {cout << si…...

告别WSL安装玄学:从0x80072f78到0x800701bc,一次搞懂Windows 11下的完整避坑指南

从0x80072f78到0x800701bc&#xff1a;Windows 11下WSL完整避坑手册 每次在Windows 11上安装WSL时&#xff0c;那些神秘的错误代码是否让你抓狂&#xff1f;0x80072f78、0x800701bc...它们像是一道道密码&#xff0c;阻挡着你进入Linux开发环境的大门。作为长期在Windows和Linu…...

2025_NIPS_Unveiling Induction Heads: Provable Training Dynamics and Feature Learning in Transformers

文章核心内容与创新点总结 核心内容 本文聚焦Transformer在n元马尔可夫链数据上的上下文学习(ICL)机制,通过分析含相对位置嵌入、多头softmax注意力和归一化前馈网络的双层Transformer训练动态,证明梯度流会收敛到实现“广义归纳头”(GIH)机制的极限模型。该模型中,第…...

MCC-425 协议转换网关:打通制冷机组与 CAN 控制器数据链路

背景在工业精密温控领域&#xff0c;制冷机组的运行参数&#xff08;如温度、压力、流量&#xff09;直接决定了工艺流程的稳定性。为了实现生产现场的数字化管理&#xff0c;必须将分布在各工位的制冷机组数据实时汇聚至中控室&#xff0c;以便上位机进行统一监控与逻辑调度 。…...

中小团队如何利用Taotoken统一管理多个项目的AI调用成本

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 中小团队如何利用Taotoken统一管理多个项目的AI调用成本 对于同时推进多个AI应用开发项目的中小型技术团队而言&#xff0c;管理分…...

告别手动拷贝!用Qt Creator远程调试嵌入式Linux应用(保姆级配置流程)

告别手动拷贝&#xff01;用Qt Creator远程调试嵌入式Linux应用&#xff08;保姆级配置流程&#xff09; 嵌入式开发中&#xff0c;最令人头疼的莫过于反复的"编译-拷贝-运行/调试"循环。每次修改代码后&#xff0c;都需要手动将可执行文件拷贝到开发板&#xff0c;再…...

安卓全局音效处理:RootlessJamesDSP原理、配置与调优实战

1. 项目概述&#xff1a;在移动音频领域实现高自由度音效处理如果你是一名对手机音质有追求的发烧友&#xff0c;或者是一位喜欢折腾系统级音频设置的安卓用户&#xff0c;那么“RootlessJamesDSP”这个名字你很可能不会陌生。简单来说&#xff0c;这是一个无需获取安卓系统最高…...

uniapp中获取APP应用签名信息

/*** 获取应用签名MD5* returns {Promise<unknown>}*/ function getAppSignatureMD5() {return new Promise((resolve) > {// 1. 环境检查if (typeof plus "undefined" || uni.getSystemInfoSync().platform ! "android") {resolve(null);return…...

基于Puppeteer的网页结构化检查工具:原理、实现与优化

1. 项目概述&#xff1a;一个面向开发者的网页内容检查与结构化工具最近在折腾一个很有意思的小项目&#xff0c;起因是团队里经常需要从各种网页上抓取信息&#xff0c;然后手动整理成结构化的数据。比如&#xff0c;产品经理丢过来一个竞品网站链接&#xff0c;让你分析一下他…...

霍尔效应绝对式双码道磁编码器【附电路】

✨ 长期致力于双码道多磁极编码器、硬件设计、误差仿真与校正、算法设计与优化研究工作&#xff0c;擅长数据搜集与处理、建模仿真、程序编写、仿真设计。 ✅ 专业定制毕设、代码 ✅ 如需沟通交流&#xff0c;点击《获取方式》 &#xff08;1&#xff09;双码道多磁极磁场检测硬…...

【Claude JavaScript开发支持终极指南】:20年前端架构师亲测的5大生产力跃迁技巧

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;Claude JavaScript开发支持的演进与定位 Claude 系列模型自发布以来&#xff0c;持续增强对前端及全栈开发场景的理解能力&#xff0c;其中 JavaScript 作为核心支持语言之一&#xff0c;其支持深度随版…...