从函数

时间:2017-04-18 05:08:19

标签: javascript promise axios

有人可以解释为什么返回Axios承诺允许进一步链接,但是在应用then()/catch()方法后返回却没有?

示例:

const url = 'https://58f58f38c9deb71200ceece2.mockapi.io/Mapss'
    
function createRequest1() {
  const request = axios.get(url)

  request
  .then(result => console.log('(1) Inside result:', result))
  .catch(error => console.error('(1) Inside error:', error))

  return request
}

function createRequest2() {
  const request = axios.get(url)

  return request
  .then(result => console.log('(2) Inside result:', result))
  .catch(error => console.error('(2) Inside error:', error))
}

createRequest1()
.then(result => console.log('(1) Outside result:', result))
.catch(error => console.error('(1) Outside error:', error))

createRequest2()
.then(result => console.log('(2) Outside result:', result))
.catch(error => console.error('(2) Outside error:', error))
<script src="https://unpkg.com/axios@0.16.1/dist/axios.min.js"></script>

https://jsfiddle.net/nandastone/81zdvodv/1/

我理解Promise方法应返回一个要链接的值,但为什么这两个返回方法之间存在差异?

1 个答案:

答案 0 :(得分:51)

您的第一个示例返回原始承诺。您的第二个示例返回不同的承诺,即通过调用catch创建的承诺。

两者之间的关键差异是:

  1. 在您的第二个示例中,您未传递分辨率值,因此then返回的承诺将使用undefined解决({{1}的返回值}})。

  2. 在您的第二个示例中,您将拒绝转换为console.log的解决方案(将undefined的结果退回console.log)。 catch处理程序不会抛出或返回拒绝的承诺,会将拒绝转换为解决方案。

  3. 关于承诺链的关键之一是它们改变了结果;每次调用catchthen都会创建一个新的承诺,他们的处理程序可以修改结果通过它们时向下游发送的内容。

    通常的模式确实是返回链的结果,但是链中的函数要么故意转换结果,要么传递它。通常情况下,除了在链的终端以外,你不会有catch处理程序,除非你正在使用它来纠正错误条件(故意将拒绝转换为分辨率)。

    如果您只想记录通过的内容,同时仍然允许调用者看到它但确实想要因任何原因返回链的结果,那么您可以这样做:

    catch

    或使用return request .then(result => { console.log(result); return result; }) .catch(error => { console.error(error); return Promise.reject(error); });

    throw