Promise的then方法可以接受前一个函数的执行结果，还可以保证另一个Promise的顺序执行，这到底是怎么做到的呢？

原理图(先上图)

问题需求

如何保证多个 promise 顺序执行？

var f1 = function (){    return new  Promise(function (resolve, reject){        setTimeout(function (){            console.log("f1 ok!")            resolve("f1 ok!");        }, 1000)    });}var f2 = function (){    return new  Promise(function (resolve, reject){        setTimeout(function (){            console.log("f2 ok!")            resolve("f2 ok!");        }, 3000)    });}var f3 = function (){    return new  Promise(function (resolve, reject){        setTimeout(function (){            console.log("f3 ok!")            resolve("f3 ok!");        }, 2000)    });}

当然如果要并行的话，我们很容易想到 Promise.all 方法:

Promise.all([f1(), f2(), f3()]).then(function (data){    console.log(data)})// f1 ok! // f3 ok! // f2 ok! // ["f1 ok!", "f2 ok!", "f3 ok!"]

如果要顺序执行：

f1().then(f2).then(f3)// f1 ok!// f2 ok!// f3 ok!//或者这样function f(all) {    var promise = Promise.resolve();    all.forEach((p, index) => {        promise = promise.then(p)    })}f([f1, f2, f3])

那么问题来了，then是如何做到顺序执行的呢，参数既可以是一个普通函数，也可是是一个返回promise的函数？

then的奥秘

很多实现promise的库都比较复杂，如果自己实现的话，可以借鉴下面简单的代码：

Promise.prototype.then = function(onFulfilled, onRejected) {    var promise = this;    return new Promise(function(resolve, reject) {        function handle(value) {            var ret = typeof onFulfilled === 'function' && onFulfilled(value) || value;            if (ret && typeof ret['then'] == 'function') {                ret.then(function(value) {                    resolve(value);                }, function(reason) {                    reject(reason);                });            } else {                resolve(ret);            }        }        function errback(reason) {            reason = typeof onRejected === 'function' && onRejected(reason) || reason;            reject(reason);        }        if (promise._status === 'PENDING') {            promise._resolves.push(handle);            promise._rejects.push(errback);        } else if (promise._status === FULFILLED) {             callback(promise._value);        } else if (promise._status === REJECTED) {            errback(promise._reason);        }    });}

重点在then的实现，看上述代码，每个then返回的是什么，是一个新的 Promise，一个新的 Promise，一个新的 Promise