博客

知识点

1. 
   
Promise.then()

   
   的返回值是一个新的Promise
2. 
Promise.then()

   需要2个参数(均可选), 第1个参数用于处理
   
resolve

   , 第2个参数用于处理
   
reject

3. 无论
   
resolve

   
   *被处理*
   
   还是
   
reject

   
   *被处理*
   
   ,
   
Promise.then()

   都会
   
   *默认*
   
   返回一个新的
   
Promise

   实例, 且该
   
Promise

   实例是
   
   *
   
resolved

   *
   
   状态的; 当然了, 这种默认的行为是可以改变的, 如果用户在处理
   
resolve

   和
   
reject

   的时候, 显式返回一个
   
Promise

   实例, 那么
   
Promise.then()

   将返回用户显式创建的
   
Promise

   实例
4. 如果
   
Promise.then()

   
   *应该处理*
   
   
resolve

   /
   
reject

   但
   
   *未处理*
   
   , 那么,
   
Promise.then()

   返回的新的
   
Promise

   实例的状态与前面的
   
Promise

   实例的状态相同

实验代码

1. Promise.then() / Promise.catch()

let p1, p2, p3, p4;

p1 = Promise.reject('[00]');
p2 = p1.then(null, null);// 不处理resolve, 也不处理reject
setTimeout(console.log, 1 * 1000, p1, p2);
// Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: "[00]"}
// Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: "[00]"} //结果为前一个Promise实例(p1)的状态: rejected

p1 = Promise.resolve('[00]');
p2 = p1.then(null, null);// 不处理resolve, 也不处理reject
setTimeout(console.log, 1 * 1000, p1, p2);
// Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: "[00]"}
// Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: "[00]"} //结果为前一个Promise实例(p1)的状态: resolved

p1 = Promise.reject('[00]');
p2 = p1.then((rslt)=>{console.log('rslt1', rslt); return '[1]'; }, null);// 不处理reject
setTimeout(console.log, 1 * 1000, p1, p2);
// Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: "[00]"}
// Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: "[00]"} //结果为前一个Promise实例(p1)的状态: rejected

p1 = Promise.reject('[00]');
p2 = p1.then(null, (err)=>{console.log('err1', err); return '[11]'; });// 处理reject
setTimeout(console.log, 1 * 1000, p1, p2);
// err1 [00]
//
// Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: "[00]"}
// Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: "[11]"} //结果变为resolved

p1 = Promise.reject('[00]');
p2 = p1.then(null, (err)=>{console.log('err1', err); return Promise.reject('[11]'); });// 显式返回rejected promise
setTimeout(console.log, 1 * 1000, p1, p2);
// err1 [00]
//
// Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: "[00]"}
// Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: "[11]"} //结果变显示返回的Promise实例: rejected

2.

Promise.all()

// `delay`毫秒后执行resolve
function timerPromisefy(delay) {
    return new Promise(function (resolve) {
        setTimeout(function () {
            resolve(delay);
        }, delay);
    });
}
var startDate = Date.now();
// 所有promise变为resolve后程序退出
Promise.all([
    timerPromisefy(1),
    timerPromisefy(32),
    timerPromisefy(64),
    timerPromisefy(128)
]).then(function (values) {
    console.log(Date.now() - startDate + 'ms');
    // 約128ms
    console.log(values);    // [1,32,64,128]
});

也就是说，这个promise对象数组中所有promise都变为resolve状态的话，至少需要128ms。实际我们计算一下Promise.all 的执行时间的话，它确实是消耗了128ms的时间。

从上述结果可以看出，传递给 Promise.all 的promise并不是一个个的顺序执行的，而是同时开始、并行执行的。

3. 在一个事件循环(event loop)中执行全部符合条件的Promise.then()

setTimeout(()=>{console.log('timeout 0');}, 0);
Promise.resolve().then(()=>{console.log('then 1');}).then(()=>{console.log('then 2');});
console.log('3');
// 3
// then 1
// then 2
// timeout 0

4.

立即resolve的Promise对象

，是在本轮“事件循环”（event loop）的结束时，而不是在下一轮“事件循环”的开始时。

setTimeout(function () {
  console.log('three');
}, 0);

Promise.resolve().then(function () {
  console.log('two');
});

console.log('one');

// one
// two
// three

上面代码中，setTimeout(fn, 0)在下一轮“事件循环”开始时执行，Promise.resolve()在本轮“事件循环”结束时执行，console.log(’one‘)则是立即执行，因此最先输出。

参考

1. 
   阮一峰的ES6#Promise对象
   
2. 
   JavaScript Promise迷你书（中文版）#2.8. Promise.all