freeCodeCamp/guide/chinese/javascript/timing-events/index.md

2.5 KiB
Raw Blame History

title localeTitle
Timing Events 时间事件

时间事件

程序员使用定时事件来延迟代码的执行或以指定的间隔重复代码。

JavaScript库中有两个用于完成这些任务的本机函数 setTimeout()setInterval()

使用setTimeout()将传递函数的执行延迟指定的时间。您传递给setTimeout()参数有两个:您要调用的函数,以及以毫秒为单位的时间量。 1秒内有1000毫秒ms。例如5000毫秒= 5秒。 setTimeout()将在指定时间过后执行一次。

setTimeout()示例:

var timeoutID; 
 
 function delayTimer() { 
  timeoutID = setTimeout(delayedFunction, 3000); 
 } 
 
 function delayedFunction() { 
  alert(Three seconds have elapsed.); 
 } 

当调用delayTimer函数时它将运行setTimeout。经过3秒后它将执行delayedFunction它将发送警报。

使用setInterval()指定要在执行之间的时间延迟重复的函数。同样,两个参数传递给setInterval() :您要调用的函数,以及以毫秒为单位的时间量。 setInterval()将继续执行,直到它被清除。

setInterval()示例:

var intervalID; 
 
 function repeatEverySecond() { 
  intervalID = setInterval(sendMessage, 1000); 
 } 
 
 function sendMessage() { 
  console.log(One second elapsed.); 
 } 

当您的代码调用函数repeatEverySecond时它将运行setInterval。 setInterval将每1000毫秒运行一次sendMessage函数。

还有相应的本机函数来停止计时事件: clearTimeout()clearInterval()

您可能已经注意到每个计时器功能都保存到变量中。当set函数运行时会为其分配一个保存到此变量的数字。生成的数字对于每个计时器实例都是唯一的。该分配的号码也是识别定时器停止的方式。因此您必须始终将计时器设置为变量。

为了清楚你的代码,你应该总是将clearTimeout()setTimeout()clearInterval()匹配到setInterval()

要停止计时器请调用相应的清除功能并将与您要停止的计时器匹配的计时器ID变量传递给它。 clearInterval()clearTimeout()的语法是相同的。

例:

var timeoutID; 
 
 function delayTimer() { 
  timeoutID = setTimeout(delayedFunction, 3000); 
 } 
 
 function delayedFunction() { 
  alert(Three seconds have elapsed.); 
 } 
 
 function clearAlert() { 
  clearTimeout(timeoutID); 
 }