JavaScript 计时器详解：setTimeout 与 setInterval 用法及参数传递

JavaScript 计时器概述

利用 JavaScript，可以在设定的时间间隔后执行代码，而非在函数调用后立即执行，这被称为计时事件。JavaScript 提供了两种主要的计时器方法：

1. window.setInterval()：该方法会在指定的周期内反复执行代码，直到窗口关闭或调用 clearInterval() 停止。
2. window.setTimeout()：用于在指定的延迟时间后执行一次代码。

setInterval 使用方法

setInterval() 的使用方法如下：

setInterval(code,millisec); 

• code 参数可以是函数名（注意不要加括号），也可以是包含函数调用的字符串（需使用双引号包裹）。例如：setInterval("setCode()", 1000) 或 setInterval(setCode, 1000)。
• millisec 参数指定毫秒数，即两次执行之间的时间间隔。

具体代码示例如下：

 var p1 = document.getElementById("p");
  var n = 0;
  var data = ["4234","343440"];
  var rows = 0;
  var cols = 0;
  function setCode(){
    if(cols < data[rows].length){
      p1.innerHTML += data[rows][cols];
      cols++;
    }else if(rows < data.length){
      p1.innerHTML += "</br>";
      rows++;
      cols = 0;
    }else {
      clearInterval(timer);
    }
  }
  var timer = setInterval(setCode,500);

计时器参数传递技巧

setTimeout 和 setInterval 的基本用法是相同的。

在计时器中直接传递参数是不支持的，那么该如何实现呢？推荐使用匿名函数。

相关代码示例：

  var person = {name: "peng", age: 23};
  function getPerson(person){
    alert(person.name);
  }
  var timer = setInterval(function(){
    getPerson(person);
  },1000);

即在定义定时器时，重新编写一个函数，在该函数内部调用目标方法。

当然，也可以直接将函数和参数用双引号括起来，但这种方式无法周期性改变参数的值。

总结

以上就是本文的全部内容，希望这些内容对您的学习或工作有所帮助。感谢支持，如需了解更多相关内容，请查看相关链接。