event-loop

事件循环 event-loop

文字解释

事件轮询 JS实现异步的具体解决方案

  • 同步代码 直接执行
  • 异步函数先放在异步队列中
  • 待同步函数执行完毕,轮询执行 异步队列中的函数
    • 轮询:不断去查看异步队列中

###实战分析

setTimeout(()=>{
  console.log('a');
},100)

setTimeout(()=>{
  console.log('b');
})

console.log('c');
c,b,a
axios.get('/').then(()=>{
  console.log('a');
})

setTimeout(()=>{
  console.log('b');
})

setTimeout(()=>{
  console.log('c');
},100)
b,c,a / b,a,c

###代码讲解

jQuery 1.5

var waitHandle = function(){
  var dtd = $.deferred();
  var wait = function(dtd){
    var task = function(){
      console.log('xxx');
      dtd.resolve();// 成功
      dtd.reject();// 失败
    }
    setTimeout(task,2000);
    return dtd;
  }
  return wait(dtd);
}

开发封闭原则

总结

dtd的API可以分为两类

  • 第一类:dtd.resolve dtd.reject

  • 主动去执行

  • 第二类:dtd.then dtd.fail dtd.done

  • Then 的方法涵盖了后二者 他是一个监听的方法

引子

var waitHandle = function(){
  var dtd = $.deferred();
  var wait = function(dtd){
    var task = function(){
      console.log('xxx');
      dtd.resolve();// 成功
      dtd.reject();// 失败
    }
    setTimeout(task,2000);
    // 不在仅仅返回一个dtd 因为之前的返回的dtd有所有的方法,
    return dtd.promise(); // 返回一个Promise对象
  }
  return wait(dtd);
}

想要深入的而理解他就需要知道他的前生今世。

©️2020 CSDN 皮肤主题: 游动-白 设计师:上身试试 返回首页