当前位置：首页 > article >正文

JS中实现类似sleep、wait、delay的延时功能

article 2026/1/15 23:42:07

前言

编写代码时很多时候需要进行流程化的操作，各个流程间通常需要等待一定时间，这在很多语言中通常可以使用 sleep 、 wait 、 delay 等函数来实现。JavaScript原生并没有类似的功能，想要延时通常就是使用 setTimeout(functionRef, delay) 方法。该方法使用比较简单，但是当一个流程中如果需要多次延时，就会出现回调地狱：

setTimeout(() => {console.log(`first print`);setTimeout(() => {console.log(`second print`);setTimeout(() => {console.log(`third print`);}, 1000);}, 1000);
}, 1000);

这种写法代码可读性和可维护性非常差，这种应用场景下使用很多支持多线程的语言中的延时函数就会方便很多。现在JS中加入了很多新的语法功能，可以方便的改造现有方法来实现类似其他语言中 sleep 、 wait 、 delay 的功能。

实现代码

具体的实现方法可能有非常多种，这里使用 Promise 、async/await 来实现相关功能，主要代码如下：

// 实现sleep功能，使用方式下面方式调用
// async function process(){
//     // your code ...
//     await sleep(1000);
//     // your code ...
// }
function sleep(ms) {return new Promise((resolve, reject) => {setTimeout(() => {resolve();}, ms);});
}

使用演示

在这里插入图片描述

上面演示中使用的完整代码如下：

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>test</title><script>function getTimeStr(params) {let now = new Date();let year = now.getFullYear();let month = String(now.getMonth() + 1).padStart(2, '0');let day = String(now.getDate()).padStart(2, '0');let hours = String(now.getHours()).padStart(2, '0');let minutes = String(now.getMinutes()).padStart(2, '0');let seconds = String(now.getSeconds()).padStart(2, '0');let milliseconds = String(now.getMilliseconds()).padStart(3, '0');let formattedTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}.${milliseconds}`;return formattedTime;}</script><script>// 实现sleep功能，使用方式下面方式调用// async function process(){//     // your code ...//     await sleep(1000);//     // your code ...// }function sleep(ms) {return new Promise((resolve, reject) => {setTimeout(() => {resolve();}, ms);});}</script><script>(async () => {await sleep(1000);console.log(`${getTimeStr()} > first print`);await sleep(1000);console.log(`${getTimeStr()} > second print`);await sleep(1000);console.log(`${getTimeStr()} > third print`);})()</script>
</head><body></body></html>

JS中实现类似sleep、wait、delay的延时功能

前言编写代码时很多时候需要进行流程化的操作，各个流程间通常需要等待一定时间，这在很多语言中通常可以使用 sleep 、 wait 、 delay 等函数来实现。JavaScript原生并没有类似的功能，想要延时通常就是使用 setTimeout(functionRef, delay) …...

编程日记 2026/1/15 23:42:07

Banana Pi BPI-RV2 RISC-V 路由器开发板发售, 全球首款RISC-V路由器

Banana Pi BPI-RV2 开源路由器是矽昌通信和⾹蕉派开源社区（Banana Pi ）合作设计, 联合打造全球首款RISC-V架构路由器开发板。这是香蕉派开源社区与矽昌通信继BPI-Wifi5 低成本Wifi5 路由器合作之后的又一力作，为全球开发者与商业客户提供基于…...

编程日记 2026/1/14 15:52:29

M｜触碰你

rating: 7 M｜触碰你碰碰的设定本身还可以，但是结局有点怪。中期剧情发展不错，三个男人和两个女人的故事。友情线笔墨多但很常规，感情线有点意思。对人际关系、沟通等的主题的探索蛮好。总之，虽然宣传是《未闻花…...

编程日记 2026/1/15 1:35:27

MAUI项目iOS应用以进 App Store 分发

目录一.通过Visual Studio分发应用1. 登录Apple 开发者帐户到 Visual Studio2.创建分发证书和配置文件3. 分发应用4. 在App Store Connect 中创建应用程序记录5. 如果你想使用mac发布应用一.通过Visual Studio分发应用 1. 登录Apple 开发者帐户到 Visual Studio 首先我们要…...

编程日记 2026/1/14 21:10:19

CentOS 7系统yum报错解决方案（CentOS 7官方EOL问题修复）

摘要解决CentOS 7因EOL导致的yum update报错问题，通过替换阿里云镜像源恢复软件安装功能，包含详细操作步骤、操作截图、验证方法与备选镜像源，附有安全风险提示。一、故障现象与原因分析 1.1 典型报错信息 # 执行yum命令时出现&#xff…...

编程日记 2026/1/14 18:38:04

解决Windows update服务启动拒绝访问的问题 | wuauserv 注册表拒绝访问的方法

在某些情况下，为了配置系统更新相关服务（例如禁用 Windows 自动更新），我们需要更改注册表中 wuauserv 项的权限。本教程将带你一步步操作，成功获取并修改权限。修改注册表路径： HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\wuauserv 步骤一：打开注册表编辑…...

编程日记 2026/1/14 20:14:18

深入解析 JDK jstack 命令：线程分析的利器

你点赞了吗？你关注了吗？每天分享干货好文。高并发解决方案与架构设计。海量数据存储和性能优化。通用框架/组件设计与封装。如何设计合适的技术架构？ 如何成功转型架构设计与技术管理？ 在竞争激烈的大环境下&#xff0c…...

编程日记 2026/1/15 2:19:29

【操作系统原理03】处理机调度与死锁

文章目录大纲一.处理机调度概念与层次0.大纲1.基本概念2.三个层次3.七状态模型4.三层调度都对比与联系二.进程调度的时机，切换与过程的调度方式0.大纲1.进程调度时机2.调度方式3.进程的切换与过程三.调度器和闲逛资源1.调度器/调度程序2.闲逛进程四.调度算法的评…...

编程日记 2026/1/14 5:12:12

Quipus，LightRag的Go版本的实现

1 项目简介奇谱系统当前版本以知识库为核心，基于知识库可以快构建自己的问答系统。知识库的Rag模块的构建算法是参考了LightRag的算法流程的Go版本优化实现，它可以帮助你快速、准确地构建自己的知识库，搭建属于自己的AI智能助手。与当前LLM…...

编程日记 2026/1/15 1:42:33

使用 Vite 快速搭建现代化 React 开发环境

1.检查环境说明：检测环境，node版本为18.20.6。 2.创建命令说明：创建命令，选择对应的选项。 npm create vitelatest 3.安装依赖说明：安装相关依赖。 npm i...

编程日记 2026/1/14 23:59:39

关于UE5的抗锯齿和TAA

关于闪烁和不稳定现象的详细解释当您关闭抗锯齿技术时，场景中会出现严重的闪烁和不稳定现象，尤其在有细节纹理和小物体的场景中。这种现象的技术原因如下： 像素采样问题在3D渲染中，每个像素只能表示一个颜色值，但…...

编程日记 2026/1/15 2:46:25

PG数据库推进医疗AI向量搜索优化路径研究(2025年3月修订版)

PG数据库推进医疗AI向量搜索优化路径研究一、医疗 AI 向量搜索的发展现状与挑战 1.1 医疗数据特征与检索需求医疗数据作为推动医疗领域进步与创新的关键要素，具有鲜明且复杂的特征。从多模态角度看，医疗数据涵盖了结构化数据，如患者基本信息、检验检查报告中的数值结果；…...

编程日记 2026/1/14 20:52:07

可穿戴经颅多通道直流电刺激产品测试总结

一概念原理 tDCS 是一种非侵入性的神经调节技术，利用恒定、低强度直流电（通常为 0 - 2mA）通过电极作用于特定的大脑区域。其工作原理是通过调节神经元的膜电位，来增加或降低神经元兴奋性的特定区域，从而改变大脑运作。…...

编程日记 2026/1/14 23:53:09

什么是 Stream

Stream 是对集合对象功能的增强，它不是集合，也不存储数据，而是从集合中抽象出一条数据通道，让你可以用链式方式一步步处理数据。 🔧 常见操作分类类型方法举例创建stream(), Stream.of(), Arrays.stream()中间操作fi…...

编程日记 2026/1/15 1:52:09

详解与HTTP服务器相关操作

HTTP 服务器是一种遵循超文本传输协议（HTTP）的服务器，用于在网络上传输和处理网页及其他相关资源。以下是关于它的详细介绍： 工作原理 HTTP 服务器监听指定端口（通常是 80 端口用于 HTTP，443 端口用于 HT…...

编程日记 2026/1/14 23:16:26

-XX:+HeapDumpOnOutOfMemoryError 会打印哪些oom错误

-XX:HeapDumpOnOutOfMemoryError 参数会在 JVM 发生以下 ‌OutOfMemoryError（OOM）‌ 错误时自动生成堆转储文件（Heap Dump），便于后续分析内存溢出原因： 一、触发转储的 OOM 错误类型 Java 堆溢出&#xf…...

编程日记 2026/1/15 1:53:19

Moldflow模流分析教程

Moldflow模流分析教程：...

编程日记 2026/1/14 15:58:42

计算机网络 3-4 数据链路层(局域网)

4.1 局域网LAN 特点 1.覆盖较小的地理范围 2.较低的时延和误码率 3.局域网内的各节点之间 4.支持单播、广播、多播分类关注三要素 （出题点） ①拓扑结构 ②传输介质 ③介质访问控制方式硬件架构 4.2 以太网 4.2.1 层次划分 4.2.2 物理层标准…...

编程日记 2026/1/12 20:33:18

加密与解密完全指南，使用Java实现

文章目录 1. 加密基础知识1.1 什么是加密？1.2 加密的历史简介1.2.1 古典加密1.2.2 现代加密的起源1.3 加密的基本概念1.3.1 密码学中的关键术语1.3.2 加密的基本原则1.4 加密的分类1.4.1 对称加密（Symmetric Encryption）1.4.2 非对称加密（Asymmetric Encryption）1.4.3 哈希…...

编程日记 2025/7/4 7:36:47

单片机AIN0、AIN1引脚功能

目录 1. 模拟-数字转换器（ADC） 2. 交流电源（AC） 总结这两部分有什么区别？ 在这个电路图中，两个部分分别是模拟-数字转换器（ADC）和交流电源（AC）。以下是这…...

编程日记 2025/12/30 0:52:51

如何增加 Elasticsearch 中的 primary shard 数量

作者：来自 Elastic Kofi Bartlett 探索增加 Elasticsearch 中 primary shard 数量的方法。更多阅读： Elasticsearch：Split index API - 把一个大的索引分拆成更多分片 Elasticsearch：通过 shrink API 减少 shard 数量来缩小 El…...

编程日记 2026/1/13 23:56:26

Java 并发性能优化：线程池的最佳实践

Java 并发性能优化：线程池的最佳实践在 Java 并发编程的世界里，线程池堪称提高应用性能与稳定性的神器。恰如其分地运用线程池，能让我们在多线程任务调度时游刃有余，既能避免线程频繁创建销毁带来的开销，又能合理管控…...

编程日记 2026/1/15 6:40:57

【综述】一文读懂卷积神经网络(CNN)

卷积神经网络（Convolutional Neural Networks, CNN）是一类包含卷积计算且具有深度结构的前馈神经网络（Feedforward Neural Networks），是深度学习（deep learning）的代表算法之一。本文旨在介绍CN…...

编程日记 2026/1/13 5:00:40

Python爬虫实战:获取网易新闻数据

一、引言随着互联网的飞速发展，网络上蕴含着海量的信息资源。新闻数据作为其中的重要组成部分，对于舆情分析、市场研究、信息传播等多个领域具有重要价值。网易新闻作为国内知名的新闻平台，拥有丰富多样的新闻内容。使用 Python 的 Scrapy 框架进行网易新闻数据的爬取，可…...

编程日记 2025/7/11 6:08:43

YOLO学习笔记｜基于COCO Stuff数据集与YOLOv11的多类别物体检测与分割

基于COCO Stuff数据集与YOLOv11的多类别物体检测与分割技术解析一、技术背景与YOLOv11核心改进 YOLOv11是Ultralytics推出的新一代目标检测与分割模型，在YOLOv8的基础上进一步优化了架构设计与训练流程。其核心改进包括：自适应特征增强（AFE）模块：通过空间上下文模块（…...

编程日记 2025/12/27 9:58:39

ICS丨Chapter 1 Introduction to Computer System

Chapter 1 Introduction to Computer System Courses About Systems: DBMSDistributed SystemsCompilersArchitectureOperating Systemse.t.c. 1. Brief Introduction 1.1. What’s about CSAPP?1.2. Power of Abstraction1.3. Importance of understanding HOW things wor…...

编程日记 2025/7/8 18:52:16

JS中实现类似sleep、wait、delay的延时功能

前言

实现代码

使用演示

相关文章：

JS中实现类似sleep、wait、delay的延时功能

Banana Pi BPI-RV2 RISC-V 路由器开发板发售, 全球首款RISC-V路由器

M｜触碰你

MAUI项目iOS应用以进 App Store 分发

CentOS 7系统yum报错解决方案（CentOS 7官方EOL问题修复）

解决Windows update服务启动拒绝访问的问题 | wuauserv 注册表拒绝访问的方法

深入解析 JDK jstack 命令：线程分析的利器

【操作系统原理03】处理机调度与死锁

Quipus，LightRag的Go版本的实现

使用 Vite 快速搭建现代化 React 开发环境

关于UE5的抗锯齿和TAA

PG数据库推进医疗AI向量搜索优化路径研究(2025年3月修订版)

可穿戴经颅多通道直流电刺激产品测试总结

什么是 Stream

详解与HTTP服务器相关操作

-XX:+HeapDumpOnOutOfMemoryError 会打印哪些oom错误

Moldflow模流分析教程

计算机网络 3-4 数据链路层(局域网)

加密与解密完全指南，使用Java实现

单片机AIN0、AIN1引脚功能

如何增加 Elasticsearch 中的 primary shard 数量

Java 并发性能优化：线程池的最佳实践

【综述】一文读懂卷积神经网络(CNN)

Python爬虫实战:获取网易新闻数据

YOLO学习笔记｜基于COCO Stuff数据集与YOLOv11的多类别物体检测与分割

ICS丨Chapter 1 Introduction to Computer System

阿里云集群开启debug

Flink Hive Catalog最佳实践

Unity之如何实现RenderStreaming视频推流

【java实现+4种变体完整例子】排序算法中【桶排序】的详细解析，包含基础实现、常见变体的完整代码示例，以及各变体的对比表格