当前位置:首页 > JavaScript

js实现settimeout

2026-04-05 09:06:12JavaScript

使用 setTimeout 实现延迟执行

setTimeout 是 JavaScript 中用于在指定时间后执行代码的函数。其基本语法如下:

setTimeout(function, delay, arg1, arg2, ...)
  • function:要执行的函数或代码字符串(不推荐使用字符串)。
  • delay:延迟时间,单位为毫秒(默认值为 0)。
  • arg1, arg2, ...:可选参数,传递给函数的参数。

基本用法

setTimeout(() => {
  console.log('这段代码将在 1 秒后执行');
}, 1000);

传递参数

可以向延迟执行的函数传递参数:

js实现settimeout

function greet(name) {
  console.log(`Hello, ${name}!`);
}

setTimeout(greet, 2000, 'Alice');

清除定时器

setTimeout 返回一个定时器 ID,可用于取消尚未执行的代码:

js实现settimeout

const timerId = setTimeout(() => {
  console.log('这段代码不会执行');
}, 3000);

clearTimeout(timerId);

递归实现周期性执行

虽然 setInterval 更适合周期性执行,但 setTimeout 也可以实现类似效果:

function repeat() {
  console.log('周期性执行');
  setTimeout(repeat, 1000);
}

setTimeout(repeat, 1000);

与 Promise 结合

可以将 setTimeout 封装在 Promise 中,实现异步延迟:

function delay(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function example() {
  console.log('开始');
  await delay(2000);
  console.log('2 秒后');
}

example();

注意事项

  • 延迟时间是最小等待时间,实际执行时间可能更长(受 JavaScript 事件循环影响)。
  • 在 Node.js 和浏览器环境中都可用,但具体实现可能有细微差异。
  • 避免在性能敏感的代码中过度使用,频繁的定时器会影响性能。

标签: jssettimeout
分享给朋友:

相关文章

jquery js

jquery js

jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。它兼容多种浏览器,提供易于使用的 API,使开发者能够更高…

js实现游标

js实现游标

使用JavaScript实现游标 在JavaScript中,可以通过操作DOM元素的cursor样式属性来实现自定义游标效果。以下是几种常见的实现方法: 修改默认鼠标指针样式 通过CSS的curso…

js图片上传实现

js图片上传实现

图片上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API实现基础图片上传功能。HTML部分需要设置accept="image/…

js分页实现

js分页实现

分页的基本原理 分页的核心是通过计算当前页码和数据偏移量,从服务器或本地数据中截取对应范围的数据进行展示。通常需要以下参数:当前页码(currentPage)、每页条数(pageSize)、总数据量(…

js实现的游戏

js实现的游戏

JavaScript 游戏开发基础 JavaScript 是开发网页游戏的流行选择,因其无需插件即可在浏览器中运行。以下是一些关键技术和资源: HTML5 Canvas Canvas 提供了绘制图形…

js实现截图

js实现截图

使用HTML2Canvas库实现截图 HTML2Canvas是一个流行的JavaScript库,可以将网页元素或整个页面转换为Canvas图像。安装方式: npm install html2canv…