JavaScript中setInterval函数的用法与clearInterval配合详解

作者:函数茶馆

时间:2026-10-29

浏览:640

本文详细介绍JavaScript中setInterval函数的两种主要语法格式,包括普通函数调用与对象方法调用的参数传递方式。同时讲解如何通过clearInterval清除定时器,确保动画或间隔操作可控。

文章目录

setInterval函数概述

在JavaScript中,setInterval函数主要用于实现动画效果或需要按固定时间间隔重复执行的操作。它允许开发者指定一个回调函数,并设定该函数被调用的时间间隔。

setInterval语法格式

setInterval函数的调用语法主要有两种形式:

第一种常见语法格式为:setInterval(fnname, time, par1, par2, ... parn);

第二种语法格式为:setInterval(obj, fnname, time, par1, par2, ... parn);

第一种语法是最常用的形式。其中,fnname参数可以是匿名函数的引用,也可以是已命名函数的名称。time参数指定调用fnname的时间间隔,单位为毫秒,默认值为10毫秒。par1到parn是可选参数,用于传递给fnname所指向的方法。

第二种语法用于调用对象的方法。此时,fnname参数指定为obj对象的一个方法,其他参数的含义与第一种语法相同。

下面通过具体示例来解释setInterval的使用方法:

setInterval使用示例


//普通语法的第一种写法

setInterval(function(){
    alert("我是setInterval方法打印结果");
  },3000) //每隔3秒打印一次

//普通语法的第二种写法

function alert1(){
    alert("我是setInterval方法打印结果")
  }
function alert2(str){
    alert(str);
  }
  setInterval(alert1,3000);
  setInterval("alert1()",3000);
  setInterval(alert2,3000,"我是setInterval方法打印结果");
  setInterval("alert1()",3000,"我是setInterval方法打印结果");

//对象方法写法

obj = new Object();//创建一个新的对象

obj.alert1 = function(){
    alert("我是setInterval方法打印结果");
  }

obj.alert2 = function(str){
    alert(str);
  }

setInterval(obj,alert1,3000);
setInterval(obj,alert2,3000,"我是setInterval方法打印结果");

clearInterval配合使用

通常,setInterval需要与clearInterval配合使用。clearInterval的作用是清除由setInterval创建的定时器调用,其参数必须是setInterval返回的定时器ID。


var timer = setInterval(obj,alert1,3000);

clearInterval(timer);

以上即为本文关于setInterval用法的完整介绍,希望读者能够从中受益。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章