当前位置:首页 > 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
分享给朋友:

相关文章

js实现计算器

js实现计算器

实现基础计算器功能 使用JavaScript创建一个基础计算器需要处理数字输入、运算符逻辑和结果显示。以下是一个简单的实现示例: let currentInput = '0'; let previo…

jquery.js

jquery.js

jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互等操作。以下是关于 jQuery.js 的核心信息和使用方法: 获…

js实现vr

js实现vr

使用WebXR API实现VR体验 WebXR是浏览器中实现VR和AR体验的标准API,它取代了早期的WebVR。现代浏览器如Chrome、Edge和Firefox已支持WebXR。 // 初始化W…

js实现交换

js实现交换

交换变量的方法 在JavaScript中,交换两个变量的值有多种方法。以下是常见的几种实现方式: 使用临时变量 通过引入一个临时变量来存储其中一个变量的值,实现交换: let a = 1; le…

节流js实现

节流js实现

节流(Throttle)的实现原理 节流是一种限制函数执行频率的技术,确保函数在一定时间间隔内最多执行一次。适用于高频触发事件(如滚动、输入、窗口调整等)的场景。 基础实现方式 使用时间戳判断是否执…

js实现下拉菜单

js实现下拉菜单

使用HTML和CSS创建基础结构 HTML部分需要包含一个触发下拉的按钮和隐藏的下拉菜单内容: <div class="dropdown"> <button class="dr…