JavaScript Promise返回值详解
Promise回顾
Promise回调函数返回非Promise值
Promise回调函数返回Promise对象
Promise回调函数中抛出错误
总结
Promise回顾
Promise对象是JavaScript ES6标准中一个重要的内容，它是为了异步而生的，相比于经典的回调函数写法，在处理大量异步任务时使用Promise链在可读性上会远远优于回调函数导致的回调地狱，本文建立在读者已经对Promise有所了解的情况下，如果你还不了解Promise，可以参考MDN上的这篇文章。
下面我们先来简要回顾一下Promise对象的性质，如果你已经足够熟悉，请前往下一节内容。
Promise有三种状态，如果用Promise()构造器创建一个Promise对象，当被创建时，它的状态是pending，如果一个Promise对象的resolve方法被调用，它的状态会变成fulfilled，而如果一个Promise对象的reject方法被调用，它的状态会变成rejected。此外，还有两种初始化Promise对象的方法，分别是Promise.resolve方法和Promise.reject方法，前者会直接返回一个状态为fulfilled的Promise对象而后者会直接返回一个状态为rejected的Promise对象。
在一个Promise链中，如果一个Promise状态变成了fulfilled，它会自动在Promise链中向下寻找，直到发现一个then方法，并执行其中的第一个参数函数，而如果一个Promise的状态变成了rejected，它会在Promise链中向下寻找，直到发现一个带有两个参数的then方法并执行它的第二个参数函数或发现一个catch方法并执行它的参数函数。
要知道，Promise.prototype.then和Promise.prototype.catch都会返回一个Promise对象，这是Promise链能生效的关键，这篇文章讨论的重点就是这两个方法的返回值。
注意：为了增强可读性，本文中涉及到Promise.prototype.then都只传入一个参数，作为fulfilled状态的回调函数，rejected状态的回调函数在Promise.prototype.catch中定义。
Promise回调函数返回非Promise值
当一个Promise.prototype.then方法被调用时，且在回调函数中返回的值是一个非Promise对象时，它会生成一个状态为fulfilled的新的Promise对象，并把该返回值传入下一个回调函数，看下面这个例子：
我们先用Promise.resolve生成了一个fulfilled状态的Promise对象以便调用then方法，在它的回调函数中我们返回了一个字符串Hello World，可以看到Promise链中第二个then方法的回调函数被调用，打印出了fulfilled: Hello World，说明前一个回调函数的返回值被传入，且在Promise链的上一环节返回的新Promise状态为fulfilled。
当一个Promise.prototype.catch方法被调用，且在回调函数中返回的值是一个非Promise对象，它仍然会生成一个状态为fulfilled的新的Promise对象，并把该返回值传入下一个回调函数，相当于错误已经被捕获，看下面这个例子：
我们先用Promise.reject生成了一个rejected状态的Promise对象，这时第一个catch方法触发，在它的回调函数里返回了字符串Hello World，此后第一个then方法触发，打印出了fulfilled: Hello World，说明前一个回调函数的返回值被传入，且在Promise链的上一环节返回的新Promise状态为fulfilled。
你可以动手试试上面的例子，自己尝试着修改一些代码并查看返回值，有助于对这一节的内容有更深的理解。
Promise回调函数返回Promise对象
如果Promise的回调函数中返回的是Promise，那么无论触发的是Promise链中的then方法还是catch方法，新生成的Promise对象的状态都直接取决于回调函数中返回的Promise对象的状态，传进下一个回调函数的值也取决于这个被返回的Promise对象，让我们看下面几个例子：
你可以动手试试上面的例子来更深刻地感受一下返回Promise对象与返回其他值时的不同。
通过这几个例子可以看到，如果回调函数中返回Promise对象，无论是then方法还是catch方法生成的Promise对象都直接取决于回调函数中的这个Promise对象。
Promise回调函数中抛出错误
如果Promise的回调函数中抛出了一个错误，则会生成一个状态为rejected的Promise，并将这个错误作为参数传给Promise链的下一个回调函数，看下面两个例子：
你可以动手试试来感受一下这种情况下抛出错误对生成的Promise对象的影响。
总结
当Promise的回调函数返回非Promise对象的值时，then和catch都生成一个状态为fulfilled的Promise对象，并把该返回值传入Promise链的下一环节。
当Promise的回调函数返回值为Promise对象时，生成的Promise对象的状态由被返回的Promise对象决定，传入Promise链下一环节的值也由这个被返回的Promise决定。
当Promise的回调函数中抛出错误时，then和catch都生成一个状态为rejected的Promise对象，并把抛出的错误对象传入Promise链的下一环节。
Original: https://www.cnblogs.com/onesea/p/15992324.html
Author: 威武的大萝卜
Title: JavaScript Promise返回值详解
原创文章受到原创版权保护。转载请注明出处：https://www.johngo689.com/535854/
转载文章受原作者版权保护。转载请注明原作者出处！