JavaScript:setInterval() 用法详解

news2024/11/18 1:49:33

文章目录

  • 1 基本语法
  • 2 参数说明
  • 3 使用示例
  • 4 停止 setInterval() 方法

1 基本语法

setInterval() 是 JavaScript 中的一个内置函数,它用于在指定的间隔时间内重复执行一段代码,实现周期性操作。该函数的语法如下:

setInterval(function, milliseconds, param1, param2, ...)

2 参数说明

  • function:必需,要重复执行的函数或代码块。
  • milliseconds:必需,重复执行的时间间隔(以毫秒为单位)。
  • param1, param2, ...:可选,传递给要执行的函数的参数。如果无须传递参数,则省略此参数。

注意:

如果 setInterval() 函数的第一个参数是一个函数,那么该函数会在每个时间间隔后被调用,直到计时器被取消。

如果 setInterval() 函数的第一个参数是一个字符串,那么该字符串会被解释为一段要执行的 JavaScript 代码。这种用法已经被弃用,不建议使用。

如果 setInterval() 函数的时间间隔设为 0 或负数,那么该函数会立即执行第一个参数所表示的函数或代码,并且不会周期性地执行。

如果 setInterval() 函数的时间间隔设为较小的值,那么可能会因为浏览器的性能限制而导致定时器不准确。建议将时间间隔设为 100 毫秒或以上,以保证计时器的准确性。

3 使用示例

使用匿名函数作为第一个参数,用来输出当前时间,间隔时间是1000毫秒即1秒钟。

// 每秒钟输出一次当前时间
setInterval(function() {
  console.log(new Date().toLocaleTimeString());
}, 1000);

4 停止 setInterval() 方法

setInterval() 方法会返回一个计时器ID,可以通过该计时器ID来取消计时器的执行,方法如下:

intervalId = setInterval(function() {
  console.log(new Date().toLocaleTimeString());
}, 1000);

clearInterval(intervalId );

其中,intervalId 是一个变量,用于保存 setInterval() 方法返回的计时器对象ID。调用 clearInterval() 方法后,就可以取消计时器的执行。

示例: 打印5次后,取消计时器的执行。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        var counter = 0;
        maxNum = 5;
        function myFunc() {
            var date = new Date();
            console.log(date.toLocaleTimeString());
            counter++;
            if (counter == maxNum) {
                clearInterval(intervalId);
                console.log('已打印' + maxNum + "次");
            }
        }

        var intervalId = setInterval(myFunc, 1000);
    </script>
</body>

</html>

打印结果:

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/604573.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

线程(Linux系统实现)

目录 1. 线程概述 2.主线程和子线程 3.创建线程 线程函数 创建线程示例 4.线程退出 线程退出的原理主要包括以下两个方面&#xff1a; 5.线程回收 回收子线程数据 6.线程分离 7.线程取消 8.线程 ID 比较 1. 线程概述 线程是轻量级的进程&#xff08;LWP&#xff…

【Java多线程进阶】常见的锁策略

前言 众所周知&#xff0c;拳击运动员是要分等级&#xff08;轻量级、重量级等等&#xff09;来参加比赛的&#xff0c;在 Java 多线程中 锁&#xff08;synchronized&#xff09; 也会根据锁的竞争程度来升级为相关“高等级”锁&#xff0c;为了更好的理解 synchronized 加锁机…

微信小程序node+vue医院挂号预约系统fun17

从而实现管理员后端&#xff1b;首页、个人中心、用户管理、专家管理、科室类型管理、职称类型管理、医院挂号管理、挂号信息管理、留言板管理、系统管理&#xff0c;专家后端&#xff1b;首页、个人中心、医院挂号管理、挂号信息管理、系统管理&#xff0c;用户前端&#xff1…

【Linux】网络基础+UDP网络套接字编程

只做自己喜欢做的事情&#xff0c;不被社会和时代裹挟着前进&#xff0c;是一件很奢侈的事。 文章目录 一、 网络基础1.局域网和广域网2.协议初识和网络协议分层&#xff08;TCP/IP四层模型&#xff09;3.MAC地址和IP地址&#xff08;子网掩码&#xff0c;路由表&#xff0c;I…

美国金融科技公司SoFi的增长难以持久,股价也将下跌

来源&#xff1a;猛兽财经 作者&#xff1a;猛兽财经 公司介绍 SoFi Technologies(SoFi)是一家来自美国的知名金融科技公司&#xff0c;自2011年成立以来&#xff0c;已成为领先的个人理财在线平台。SoFi为年轻的高收入客户提供多样化的产品和服务&#xff0c;包括学生和汽车贷…

如何在 Python 中使用断点调试

入门教程、案例源码、学习资料、读者群 请访问&#xff1a; python666.cn 实际上没人能一次就写出完美的代码&#xff0c;除了我。但是世界上只有一个我。 林纳斯托瓦兹&#xff08;Linux 之父&#xff09; 大家好&#xff0c;欢迎来到 Crossin的编程教室 &#xff01; 上面这段…

【CSS3系列】第二章 · CSS3 新增盒模型和背景属性

写在前面 Hello大家好&#xff0c; 我是【麟-小白】&#xff0c;一位软件工程专业的学生&#xff0c;喜好计算机知识。希望大家能够一起学习进步呀&#xff01;本人是一名在读大学生&#xff0c;专业水平有限&#xff0c;如发现错误或不足之处&#xff0c;请多多指正&#xff0…

大数据:数据表操作,分区表,分桶表,修改表,array,map, struct

大数据&#xff1a;数据表操作&#xff0c;分区表 2022找工作是学历、能力和运气的超强结合体&#xff0c;遇到寒冬&#xff0c;大厂不招人&#xff0c;可能很多算法学生都得去找开发&#xff0c;测开 测开的话&#xff0c;你就得学数据库&#xff0c;sql&#xff0c;oracle&a…

【能量算子】评估 EEG 中的瞬时能量:非负、频率加权能量算子(PythonMatlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

五种方法提升Midjourney的出图品质

本文基于B站UP主琥珀川Eric的《五种方法提升Midjourney出图品质》制作在此感谢大神的分享。 本文全面介绍以上五种提升Midjourney出图品质的方法&#xff0c;简单实用&#xff0c;马上就可以用上。Lets go&#xff01;&#xff01;&#xff01; 方法一 使用相机参数创建逼真的图…

windows系统编译的Qt程序转到国产化麒麟linux中编译

团队自研股票软件&#xff0c;关威信共总号&#xff1a;QStockView&#xff0c;下载 1.1 windows系统编译的Qt程序转到国产化麒麟linux中编译 &#xff08;1&#xff09;把Vs工程项目文件导入到Linux中 首先把vs的工程拷贝到linux里面&#xff08;可以用虚拟机的共享文件夹…

适配器模式的学习与使用

1、适配器模式的学习 当我们需要将一个类的接口转换成另一个客户端所期望的接口时&#xff0c;适配器模式&#xff08;Adapter Pattern&#xff09;可以派上用场。它允许不兼容的接口之间能够协同工作。   适配器模式属于结构型设计模式&#xff0c;它包含以下几个角色&#…

2、数据库:SQL Server部署 - 系统部署系列文章

对于微软的SQL Server的安装&#xff0c;以前已经有写过了&#xff0c;到了2022版本&#xff0c;安装没多大的改变&#xff0c;很多只需要少配置&#xff0c;然后直接下一步即可。现在是2023年了&#xff0c;SQL Server已经出到了2022版本&#xff0c;这篇博文就再次对SQL Serv…

chatgpt赋能python:Python列表按长度排序的方法

Python列表按长度排序的方法 在Python编程中&#xff0c;列表是最常用的数据结构之一。列表是一种可变的有序序列&#xff0c;可以包含任意类型的对象。有时候&#xff0c;我们需要对列表按照元素的长度进行排序。本文将介绍Python中列表按长度排序的两种方法。 方法一&#…

pytorch实战 -- 神经网络

softmax的基本概念 交叉熵损失函数 模型训练和预测 在训练好softmax回归模型后&#xff0c;给定任一样本特征&#xff0c;就可以预测每个输出类别的概率。通常&#xff0c;我们把预测概率最大的类别作为输出类别。如果它与真实类别&#xff08;标签&#xff09;一致&#xff0…

chatgpt赋能python:Python列表排序详解:从基础排序到高级算法

Python 列表排序详解&#xff1a;从基础排序到高级算法 在 Python 编程中&#xff0c;列表是常用的数据类型。列表的排序是其中重要的操作之一。Python 提供了多种方法来对列表进行排序&#xff0c;从简单的基础排序到高级的算法排序。在这篇文章中&#xff0c;我们将详细介绍…

找到 FSM 的区别序列、UIO 或特征集(W方法)

找到 FSM 的区别序列、UIO 或特征集(W方法) 1 简介 许多系统都是基于状态的&#xff1a;它们有一个更新的内部状态通过操作并影响行为。 在测试这样一个系统时&#xff0c;一个需要考虑状态。 这导致了一系列的语言&#xff0c;用于描述基于状态的规范和模型&#xff0c;这些可…

并发编程-系统学习篇

并发编程的掌握过程并不容易。 我相信为了解决这个问题&#xff0c;你也听别人总结过&#xff1a;并发编程的第 一原则&#xff0c; 那就是不要写并发程序 这个原则在我刚毕业的那几年曾经是行得通的&#xff0c;那个时候多核服务器还是一种奢侈品&#xff0c;系统的并发量也很…

沙盒不再高端,Windows11将自带沙盒让程序检测更方便

Windows 沙盒提供了轻型桌面环境&#xff0c;可以安全地在隔离状态下运行应用程序。 安装在 Windows 沙盒环境下的软件保持“沙盒”状态&#xff0c;并且与主机分开运行。 沙盒是临时的。 当关闭沙盒后&#xff0c;系统将删除所有软件和文件以及状态。 每次使用时&#xff0c;…

AWK常用用法

awk简介 awk其名称得自于它的创始人 Alfred Aho 、Peter Weinberger 和 Brian Kernighan 姓氏的首个字母。实际上 AWK 的确拥有自己的语言&#xff1a; AWK 程序设计语言 &#xff0c; 三位创建者已将它正式定义为“样式扫描和处理语言”。它允许您创建简短的程序&#xff0c;…