Detailed explanation of JavaScript timer usage

timer

●In js, there are two kinds of timers, countdown timer and interval timer
○Countdown timer is also called one-time timer or delay timer
○Interval timer is also called intermittent timer or repetitive timer
countdown Timer
Countdown how long to execute the function
Syntax: setTimeout (the function to be executed, how long to execute after)
●The function will be executed after the time you set

var timerId = setTimeout(function () {
  console.log('我执行了')//1秒后执行我执行了 只执行一次
}, 1000)
console.log(timerId) // 1 这个1说明页面上只有一个定时器

●The time is calculated in milliseconds, 1000 milliseconds is 1 second
●So the function will be executed 1 second after the page is opened
●It will only be executed once and will not be executed anymore
●The return value is that the current timer is the first in the page several timers


interval timer

●Execute the function every time interval
●Syntax: setInterval(the function to be executed, the time interval)

var timerId = setInterval(function() {
    console.log('我执行了')//间隔1秒执行一次 我执行了
}, 1000)
console.log(timerId);//1  这个1说明页面上只有一个定时器

●The time is the same as before, it is calculated in milliseconds
●Execute the function every 1 second
●As long as it is not closed, it will continue to execute
●The return value is, which timer is the current timer on the page


The return value of the timer

●When setting a timer, its return value is part of setTimeout and setInterval
●As long as there is a timer, it is a number

var timerId = setTimeout(function () {
  console.log('倒计时定时器')
}, 1000)

var timerId2 = setInterval(function () {
  console.log('间隔定时器')
}, 1000)

console.log(timerId) // 1
console.log(timerId2) // 2

js asynchronous code execution mechanism


Synchronize

●The code is executed sequentially from top to bottom, the execution of the previous line is not completed, and the next line will not start

asynchronous

●When js encounters asynchronous code, it will take it out first, put it in the asynchronous queue and wait, and will not execute it temporarily
●Because js is a single-threaded code, it can only do one thing at the same time


Synchronous and asynchronous execution times

●The synchronous code is executed first, and the asynchronous code is executed after the synchronous code is executed.
After the asynchronous code is executed in the host environment, it is stored in the task queue.
After the synchronous code is executed, the time loop mechanism Event loop returns to the task queue to call the asynchronous code
. Adds the asynchronous task to the execution stack for execution.

console.log('start')  // start  第一打印出來的

setTimeout(function() {
    console.log('timeout') //timeout  最后打印出來的
}, 0)

console.log('end')//end  第二打印出來的

 Follow me to learn more about "front-end" technical knowledge!

A full set of JavaScript video tutorials (learn Js in 10 days, a must for getting started with front-end javascript)

Guess you like

Origin blog.csdn.net/GUDUzhongliang/article/details/131557397