js异步和promise的学习

js异步

记录下我对js的理解

promise对象

• 是异步编程的一种解决方案，相对于传统的解决方案—回调函数和事件–更合理和强大。
• 所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果
• promise有三种状态，pending(进行中)、rejected、fulfilled，只要状态发生改变，就几乎不怎么会变，这时称为resolved
• promise构造函数接受一个函数作为参数，该函数两个参数是resolve,reject，这两个参数也是函数。resolve函数的作用是，将Promise对象的状态从“未完成”变为“成功”（即从 pending 变为 resolved），在异步操作成功时调用，并将异步操作的结果，作为参数传递出去；reject函数的作用是，将Promise对象的状态从“未完成”变为“失败”（即从 pending 变为 rejected），在异步操作失败时调用，并将异步操作报出的错误，作为参数传递出去。

const promise = new Promise(function(resolve, reject) {
  // ... some code

  if (/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});

• promise实例生成后，用then指定resolved和rejected的回调函数。可以为空

promise.then(function(value) {
  // success
}, function(error) {
  // failure
});

promise典型用法：我们在构造promise对象的时候放入异步操作，等完成后会调用then指定的回调函数

js执行机制

• js是单线程的脚本语言
• 同步任务：在主线程上排队等待执行的任务
• 异步任务：不进入主线程，进入任务队列的任务。只有主线程任务执行完了，才会进入任务队列执行！ settimeout 只是延迟进入任务队列。异步任务分宏任务和微任务
• 宏任务：setTimeout，setInterval等
• 微任务：promise(构建的时候立即就开始执行) process.nexttick 。

执行机制 主线程任务->微任务->宏任务

console.log('1');
setTimeout(function() {
    console.log('2');
    new Promise(function(resolve) {
        console.log('3');
        resolve();
    }).then(function() {
        console.log('4')
    })
})
new Promise(function(resolve) {
    console.log('5');
    resolve();
}).then(function() {
    console.log('6')
})

setTimeout(function() {
    console.log('7');
    new Promise(function(resolve) {
        console.log('8');
    }).then(function() {
        console.log('9')  //不输出 没有完成态
    })
})
console.log('10');

** 输出顺序 1 5 10 6 2 3 4 7 8 **

参考

参考1
参考2
参考3