JS 异步编程之定时器

JS中异步编程的方法有很多种，比如定时器、回调函数、Promise等等。本文将介绍其中一种常用的异步编程方法：定时器。

定时器

定时器（Timer）是JavaScript中用于延迟执行某个函数或代码块的一类对象。定时器可以分为两种：单次定时器和循环定时器。

单次定时器

单次定时器会在指定的时间延迟后执行一次函数或代码块。在JavaScript中，可以使用setTimeout()方法创建单次定时器。setTimeout()方法的语法如下：

setTimeout(function, milliseconds);

• function是要执行的函数或代码块。
• milliseconds是要延迟的时间，单位是毫秒。

例如，以下代码会在2秒后输出"Hello World!"：

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

循环定时器

循环定时器会每隔指定的时间执行一次函数或代码块。在JavaScript中，可以使用setInterval()方法创建循环定时器。setInterval()方法的语法如下：

setInterval(function, milliseconds);

• function是要执行的函数或代码块。
• milliseconds是要延迟的时间，单位是毫秒。

例如，以下代码会在每隔1秒输出"Hello World!"：

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

清除定时器

有时，我们可能需要清除定时器，以防止它们继续执行。在JavaScript中，可以使用clearTimeout()和clearInterval()方法清除定时器。

• clearTimeout()方法用于清除单次定时器。
• clearInterval()方法用于清除循环定时器。

例如，以下代码会清除上面创建的单次定时器：

clearTimeout(timeoutID);

以下代码会清除上面创建的循环定时器：

clearInterval(intervalID);

如何清除定时器

在JavaScript中，有几种方法可以清除定时器：

• 使用clearTimeout()和clearInterval()方法。
• 使用return语句。
• 将定时器ID存储在一个变量中，然后使用delete操作符删除该变量。

例如，以下代码使用clearTimeout()方法清除定时器：

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

clearTimeout(timeoutID);

以下代码使用return语句清除定时器：

function myFunction() {
  setTimeout(function() {
    console.log("Hello World!");
  }, 2000);

  return;
}

myFunction();

以下代码将定时器ID存储在一个变量中，然后使用delete操作符删除该变量：

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

delete timeoutID;

结语

定时器是JavaScript中异步编程的重要组成部分。定时器可以用来延迟执行某个函数或代码块，也可以用来每隔指定的时间执行一次函数或代码块。在JavaScript中，可以使用setTimeout()和setInterval()方法创建定时器，可以使用clearTimeout()和clearInterval()方法清除定时器。