当前位置:首页 > JavaScript

js实现setinterval

2026-03-13 22:27:33JavaScript

使用 setInterval 的基本语法

setInterval 是 JavaScript 中用于周期性执行代码的函数。其基本语法如下:

const intervalID = setInterval(callback, delay, [arg1, arg2, ...]);
  • callback:需要周期性执行的函数。
  • delay:每次执行之间的时间间隔(毫秒)。
  • arg1, arg2, ...(可选):传递给 callback 的参数。

示例:周期性打印消息

以下代码每隔 1 秒打印一次 "Hello, World!":

function sayHello() {
  console.log("Hello, World!");
}

const intervalID = setInterval(sayHello, 1000);

停止 setInterval

clearInterval 用于停止 setInterval 的执行。传入 setInterval 返回的 ID 即可:

clearInterval(intervalID);

示例:5 秒后停止打印

以下代码在 5 秒后停止打印消息:

function sayHello() {
  console.log("Hello, World!");
}

const intervalID = setInterval(sayHello, 1000);

setTimeout(() => {
  clearInterval(intervalID);
  console.log("Stopped printing.");
}, 5000);

传递参数给回调函数

setInterval 可以传递额外的参数给回调函数:

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

const intervalID = setInterval(greet, 1000, "Alice");

使用箭头函数简化

可以直接在 setInterval 中使用箭头函数:

js实现setinterval

const intervalID = setInterval(() => {
  console.log("This runs every second.");
}, 1000);

注意事项

  • delay 的最小值通常为 4 毫秒(浏览器限制),实际延迟可能因系统负载而略有差异。
  • 避免在回调函数中执行耗时操作,否则可能导致间隔不准确。
  • 确保在不需要时调用 clearInterval,否则可能导致内存泄漏。

标签: jssetinterval
分享给朋友:

相关文章

js实现继承

js实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Parent…

js实现类

js实现类

JavaScript 实现类的几种方式 JavaScript 是一种基于原型的语言,但在 ES6 之后引入了 class 语法糖,使得实现类更加直观。以下是几种常见的实现方式: 使用构造函数 传统的…

js实现投球

js实现投球

实现投球动画的基本思路 使用JavaScript和CSS动画结合的方式模拟投球效果。核心是通过改变元素的位置、旋转和缩放属性,配合定时器或CSS过渡实现平滑动画。 创建基础HTML结构 <…

链表实现js

链表实现js

链表的基本概念 链表是一种线性数据结构,由一系列节点组成,每个节点包含数据和一个指向下一个节点的指针(单向链表)或两个指针(双向链表)。与数组不同,链表在内存中非连续存储,插入和删除操作更高效,但随机…

节流js实现

节流js实现

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

js实现滚动

js实现滚动

实现滚动效果的方法 在JavaScript中实现滚动效果可以通过多种方式完成,以下是一些常见的方法: 使用window.scrollTo() window.scrollTo()方法可以将页面滚动到指…