Shulou(Shulou.com)06/02 Report--

In this issue, the editor will bring you about what the JavaScript timer is. The article is rich in content and analyzes and narrates it from a professional point of view. I hope you can get something after reading this article.

1. Brief introduction

There are two timers in JavaScript, setInterval () and setTimeout (), and there are methods to cancel the timer.

These are all objects of window, and you can omit window when calling. These two methods are not in the JavaScript specification.

There are four methods related to timer:

Method describes how setInterval periodically calls a function (function) or executes a piece of code. ClearInterval cancels the repeated execution action set with setInterval. SetTimeout calls a function or executes a code snippet after the specified delay time. The clearTimeout method cancels the timeout set by the setTimeout () method.

Note: setTimeout () executes setInterval () only once and periodically at a given interval.

2. SetInterval2.1 description

The setInterval () method can repeatedly call a function or execute a code snippet according to a specified cycle. The period is in milliseconds.

The setInterval () method is called all the time if it is not closed by the clearInterval () method or if the page is closed.

SetInterval has more than one parameter.

First, if the first parameter is a code segment, then the setInterval () method can be optionally filled.

Second, the setInterval () method can have multiple arguments if the first argument is a function.

Let timerId = setInterval (func | code, delay, arg1,arg2,...) 2.2 Parameter parameters are required / optional description func | the function or code string to be executed after the function called by code is required. The time required before code execution is required (in milliseconds). The default value is 0arg1arg2. Select the parameter list to pass in the function (or code string) to be executed (not supported below IE9)

Note: the parameter func | code is usually passed as a function. For some historical reason, incoming code strings are supported, but this is not recommended.

2.3 return value

The return value timeoutID is a positive integer indicating the number of the timer. This value can be passed to clearTimeout () to cancel the timer.

2.4 usage

This is an example of clicking a button and adding one to the number every other second.

After clicking, wait for a second number to add one const showNum = document.getElementById ("showNum"); let timerId; let num = 0; addNum (); function timer () {timerId = setTimeout (addNum, 1000);} function addNum () {showNum.innerText = `${num++}`;} 4. Cancel timer

The clearInterval () method cancels the timer set by setInterval ().

The clearTimeout () method cancels the timer set by setTimeout ().

The method is simple, with only one parameter, timeoutID, which is the identifier of the timer you want to cancel.

The ID is returned by the corresponding setTimeout () or clearTimeout () call.

ClearInterval (intervalID); clearTimeout (timeoutID)

Note: note that setTimeout () and setInterval () share a numbering pool, and technically, clearTimeout () and clearInterval () are interchangeable. However, to avoid confusion, do not mix untimed functions.

The usage is simple:

Function timer () {timerId = setTimeout (addNum, 1000);} clearTimeout (timerId); / / when the code runs to this line, the timer set by timer is canceled. 5. Use timers in the console

Timers can also be used in the browser console

Console.time (timerName)

Create a timer called name and start timing.

Note: each timer must have a unique name, and a maximum of 10000 timers can be run at the same time on the page.

Console.timeEnd (timerName)

Call console.timeEnd (name) to stop the timer and output the elapsed time in milliseconds.

Console.time (timerName); console.timeEnd (timerName)

5.1 usage

Example of how long it takes for 99999 for loops:

Console.time (name); let num;for (let index = 0; index < 99999; index++) {num++;} console.timeEnd (name). This is what JavaScript timer is shared by the editor. If you happen to have similar doubts, please refer to the above analysis to understand. If you want to know more about it, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.