当前位置:首页 > JavaScript

js实现settimeout

2026-03-02 08:01:23JavaScript

使用 setTimeout 实现延时执行

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

setTimeout(function, delay, [arg1], [arg2], ...);
  • function:需要延时执行的函数。
  • delay:延时时间(毫秒)。
  • arg1, arg2:可选参数,传递给函数的额外参数。

基本用法示例

以下代码会在 2 秒后打印 "Hello, World!":

js实现settimeout

setTimeout(() => {
  console.log("Hello, World!");
}, 2000);

传递参数给回调函数

可以通过 setTimeout 的额外参数传递数据给回调函数:

setTimeout((message) => {
  console.log(message);
}, 1000, "This is a message");

清除 setTimeout

setTimeout 返回一个计时器 ID,可以通过 clearTimeout 取消延时执行:

js实现settimeout

const timerId = setTimeout(() => {
  console.log("This will not run");
}, 3000);

clearTimeout(timerId);

使用箭头函数简化

箭头函数可以简化回调的写法:

setTimeout(() => console.log("Simplified"), 1500);

递归实现周期性任务

虽然 setInterval 更适合周期性任务,但 setTimeout 也可以通过递归实现类似效果:

function repeat() {
  console.log("Recursive timeout");
  setTimeout(repeat, 1000);
}
setTimeout(repeat, 1000);

注意事项

  • 延时时间只是最小值,实际执行时间可能因浏览器繁忙而延迟。
  • 避免在回调中执行耗时操作,以免阻塞主线程。
  • 在单页应用切换时,未执行的 setTimeout 仍会继续运行,必要时需清除。

标签: jssettimeout
分享给朋友:

相关文章

js实现抽奖

js实现抽奖

实现抽奖功能的基本思路 抽奖功能的核心是随机选择奖项并展示结果。可以通过数组存储奖项,利用随机数生成索引,最后通过动画增强用户体验。 准备奖项数据 定义一个数组存储奖项信息,每个奖项可以包含名称、图…

js实现选题

js实现选题

实现选题功能的JavaScript方法 基础实现方案 使用数组存储选项,通过随机索引选取: const options = ['选项A', '选项B', '选项C', '选项D']; const r…

利用js实现

利用js实现

使用 JavaScript 实现 在 JavaScript 中,可以通过多种方式实现功能,具体取决于需求。以下是几种常见的方法: 方法一:使用原生 JavaScript // 示例代码 funct…

js验证码的实现

js验证码的实现

验证码的基本实现原理 验证码(CAPTCHA)的核心目标是区分人类用户和自动化程序。JavaScript可用于生成或验证客户端验证码,但需注意纯前端验证可能被绕过,通常需结合后端验证。 纯前端验证码…

js实现图片放大

js实现图片放大

使用 CSS transform 实现图片放大 通过 CSS 的 transform: scale() 属性实现图片放大效果。当鼠标悬停时,图片会平滑放大。 const img = document…

js 实现mvc

js 实现mvc

MVC 模式简介 MVC(Model-View-Controller)是一种软件设计模式,将应用程序分为三个核心组件:模型(Model)处理数据和业务逻辑,视图(View)负责展示数据,控制器(Con…