定时器和异步代码

定时器和倒计时器

• 两种定时器

  • 1. setInterval 计时器,每间隔固定的时间执行一次
       • 语法: setInterval(函数,数字/时间) 函数:每间隔固定的时阃要执行的代码 数字:间隔的时间,注意单位是毫秒,最小值为4~20毫秒 (1000毫秒 = 1秒)
  • 2. setTimeout 倒计时器，在指定时间到达后,执行一次
       • 语法: setTimeout(函数,数字/时间) 函数:在指定时间到达后要执行的代码 数字:间隔时间，单位也是毫秒
  • 3. 两个定时器的返回值与意义
    • 返回值不区分定时器种类，用于表示你这个定时器是页面中第几个定时器
    • 作用:用来关闭定时器
  • 4. 关闭定时器

    • 4.1语法:

      • cLearTimeout(定时器返回值)
        // 注意:能够关闭计时器也能关闭倒计时器,开发人员的约定,这个定时器只用来关闭倒计时器, 目的就是为了让其他开发人员看到这个行代码之后，知道你关闭了一个倒计时器

      • cLearInterval(定时器返回值) // 注意:能够关闭计时器也能关闭倒计时器，开发人员的约定:这个定时器只用来关闭计时器 目的就是为了让其他开发人员开到这行代码后，知道你关闭了一个之计时器

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

• 两种定时器的代码

   // 1. 计时器 setInterval
   setInterval(function(){
       console.log('我是一个定时器')                   // 每间隔100毫秒就会打印一次
   },1000)
  
   // 2.倒计时器  setTimeout
       setTimeout(function(){
           console.log('我是一个倒计时器')                 // 打开页面3000毫秒后只打印一次
       }, 3000)
  
   // 3.返回值
       var timeId1 = setInterval(function() {            //定义一个变量 timeId1 接收返回值
           console.log('我是一个定时器')       
       },1000)
  
       var timeId2 = setTimeout(function(){              // 定义一个变量 timeId1 接收返回值
           console.log('我是一个倒计时器')             
       }, 3000)
  
   // 4.关闭定时器
       cLearInterval(timeId1)                             //  约定  关闭计时器
       cLearTimeout(timeId2)                              //  约定  关闭到计时器
  

简单的代码异步执行机制（并不是详细的)

• 面试题(背诵全文)

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

  • 2.异步代码: 当代码遇到异步任务的时候，会把这个代码放在‘异步队列’内等待, 所有的同步代码全都执行完毕之后，在开始执行“异步队列”内的代码

  • 两种定时器都是异步任务

• 代码

    console.log('开始');
    setTimeout (function(){
        console.log('倒计时定时器开始执行')
    }, 3000)
    console.log('结束')
   
    //先打印开始和结束,倒计时器先放到异步代码队列内等着,执行完开始和结束后再执行倒计时定时器