计时器 倒计时器

一、setInterval

1. 作用：计时器，每间隔固定的时间执行一次

2. 语法：setInterval(函数，数字/时间)

3. 函数：间隔固定的时间要执行的代码

4. 数字：间隔的时间，单位是毫秒，最小值是4~20

var timeID = setInterval(function(){
     console.log('计时器')  
},1000)

二、setTimeout

1. 作用：倒计时器，在指定时间到达后执行一次

2. 语法：setTimeout(函数，数字/时间)

3. 函数：在指定时间到达后要执行的代码

4. 数字：间隔的时间，单位是毫秒

var timeID = setInterval(function(){
     console.log('倒计时器')  
},3000)

三、计时器的返回值

1.返回值不区分定时器种类，用于表示这个定时器是页面中的第几个定时器。2. 作用：用来关闭定时器

var timeID1 = setInterval(function(){
     console.log('计时器')  
},1000)
var timeID2 = setInterval(function(){
     console.log('倒计时器')  
},3000)
console.log(timeID1)  //返回值为1，表示timeID1是页面中的第一个计时器
console.log(timeID2)  //返回值为2，表示timeID1是页面中的第二个计时器

四、关闭计时器

1. 不区分定时器种类，只要给出正确的定时器返回值就可以关闭。

2. 语法1：

• clearTimeout(定时器返回值)

• 正常来说，两种定时器都可以关闭。

• 但是开发人员约定：这个定时器只能用来关闭倒计时器。目的就是为了让其他开发人员看到这行代码后，知道关闭了倒计时器。

3. 语法2：

• clearInterval(定时器返回值)

• 正常来说，两种定时器都可以关闭。

• 但是开发人员约定：这个定时器只能用来关闭计时器。目的就是为了让其他开发人员看到这行代码后，知道关闭了计时器。

var timeID1 = setInterval(function(){
     console.log('计时器')  
},1000)
var timeID2 = setInterval(function(){
     console.log('倒计时器')  
},3000)
clearInterval(timeID1)    //开发人员约定：关闭计时器
clearTimeout(timeID2)    //开发人员约定：关闭倒计时器

五、简单的代码异步执行

1. 首先明确：什么是“非异步代码”？

• 非异步代码就是按照从上往下、从左到右的顺序，依次执行每行代码，如果上一行代码没有执行完毕，不会执行下一行代码。

2. 什么是“异步代码”？

• 当代码遇到异步任务的时候，会把这个代码放在“异步队列”内等待，所有的同步代码执行完毕之后，再开始执行“异步队列”内的代码。

• 简单来说，执行代码时，如果遇到异步任务， 会先把它放在“异步队列”内等待，然后继续往下执行，直到所有代码执行完毕之后，再开始执行异步任务。

3. 什么是“异步任务”？

• 两种计时器都是异步任务。

• 可以理解为，先执行定时器外面的代码，再执行定时器里面的代码。

    console.log('开始')
    var timeID = setInterval(function(){
      console.log('计时器')
    },1000)
    console.log('1')
    console.log('2')
    console.log('3')
    console.log('4')
    console.log('结束')
    
/*打印结果：
       开始
        1
        2
        3
        4
       结束
       计时器
*/