Promise.then方法的执行顺序例题分析

const p = Promise.resolve();
const p1 = Promise.resolve(p); //就是p
const p2 = new Promise(res => res(p)); //新建一个对象，对象状态依赖p
// res(p)可以看作 await p1; await resolve();
// 或者p.then(data => getData()).then(() => p2.resolve())// 首先；p1 === p; p2!===p
// 那么，p1是一个fulfilled状态的对象；p2状态需要运行后求得
console.log(p === p1); // true
console.log(p === p2); // falsep1.then(() => {
console.log('p1-1');
}).then(() => {
console.log('p1-2');
}).then(() => {
console.log('p1-3');
})
p2.then(() => { //p2.resolve之后才能调用回调函数
console.log('p2-1');
}).then(() => {
console.log('p2-2');
}).then(() => {
console.log('p2-3');
})
p.then(() => {
console.log('p-1');
}).then(() => {
console.log('p-2');
}).then(() => {
console.log('p-3');
})
// 运行结果
// getData()
p1-1
p-1
// resolve()
p1-2
p-2
p2-1
p1-3
p-3
p2-2
p2-3

let p3;
p1 = new Promise(resolve => {
p3 = new Promise(res => res());
p3.then(() => {
console.log('p3')
resolve(); // resolve()方法用在then方法中，变为异步执行
})
})
p1.then(() => {
console.log('p1-1');
}).then(() => {
console.log('p1-2');
})
p3.then(() => {
console.log('p3-1')
}).then(() => {
console.log('p3-2')
})
// 运行结果如下：
p3
p3-1
p1-1
p3-2
p1-2

const p1 = Promise.resolve();
let p3;
const p2 = new Promise(function(resolve, reject){
p3 = new Promise(res => res(p1));
p3.then(() => { //1 p3.then第一个
console.log('p3')
resolve('ok');
})
});
p1.then(() => {
console.log('p1-1')
}).then(() => {
console.log('p1-2')
}).then(() => {
console.log('p1-3')
})
p2.then(function(data) {
console.log('p2-1')
}).then(function(data) {
console.log('p2-2')
}).then(function(data) {
console.log('p2-3')
})
// p3.then第二个，p3状态变化触发then方法时，同时触发，按照先后顺序执行
// 只要时p3.then(...)都同时触发
p3.then(function(data) {
console.log('p3-1')
}).then(function(data) {
console.log('p3-2')
}).then(function(data) {
console.log('p3-3')
})
// 运行结果
p1-1
p1-2
p3
p3-1
p1-3
p2-1
p3-2
p2-2
p3-3
p2-3

const p1 = Promise.resolve();
const p2 = Promise.reject(); //状态为rejected
p1.then(() => {
console.log('p1-1')
}).then(() => {
console.log('p1-2')
}).then(() => {
console.log('p1-3')
})
p2.then(function(data) { //会立即触发，但是触发的是then中省略的第二个函数；
console.log('p2-1')
}).then(function(data) {
console.log('p2-2')
}).then(function(data) {
console.log('p2-3')
}).catch(() => {
console.log('catched')
})
// 运行结果如下：
p1-1
// 默认运行p2的第一个错误回调
p1-2
// 默认运行p2的第二个错误回调
p1-3
// 默认运行p2的第三个错误回调
catched

async function async1() {
console.log('async1 start');
await async2(); //async()函数执行是同步调用；生成Promise后等待状态改变返回结果是then任务
console.log('async1 end');
}
async function async2() {
console.log('async2');
}
console.log('script start');
setTimeout(() => {
console.log('setTimeout')
})
async1();
new Promise((resolve, reject) => {
console.log('promise1');
resolve();
}).then(() => {
console.log('promise2');
})
// 运行结果如下
script start
async1 start
async2
promise1
async1 end
promise2
setTimeout