从 Javascript Promise 链返回值 [英] Returning values from Javascript Promise chain

问题描述

现代 JS/Promise 新手在这里.尽管有大量关于这个主题的内容，但我无法找到一个简单问题的答案.

Modern JS/Promise newbie here. I'm having trouble finding the answer to a simple question, despite the overwhelming amount of content on this subject.

我相信我对 JS Promises 有很好的理解(感谢各种来源，包括 mdn 和 https://spin.atomicobject.com/2016/02/16/how-javascript-promises-work/)

I believe I have a decent understanding of JS Promises (thanks to various sources, including mdn and https://spin.atomicobject.com/2016/02/16/how-javascript-promises-work/)

我经常以最简单的形式使用和生成 Promise，但是我一直在使用以下模式的继承项目中的方法上磕磕绊绊:

I have consumed and produced Promises regularly in their simplest form, however I keep stumbling on methods in my inherited projects with the following pattern:

const doAsyncOp = () => 
  $http.get(uri)
    .then(
      value => value,
      reject => //... 
    );

我的大问题是:当您简单地从成功处理程序返回一个值时会发生什么?我需要使用此方法，并且需要访问客户端代码中的值".这在技术上是未处理的吗?我应该重写实现吗?

My big question is: What happens when you simply return a value from your success handler? I need to consume this method, and need access to 'value' in the client code. Is this technically unhandled? Should I rewrite the implementation?

推荐答案

我的大问题是:当您从成功处理程序中简单地返回一个值时会发生什么?

My big question is: What happens when you simply return a value from your success handler?

当您从 .then() 处理程序返回一个值时，该值将成为父承诺链的已解析值:因此，在此代码中:

When you return a value from a .then() handler, that value becomes the resolved value of the parent promise chain: So, in this code:

// utility function that returns a promise that resolves after a delay
function delay(t, v) {
    return new Promise(resolve => {
        setTimeout(resolve.bind(null, v), t);
    });
}

function test() {
    return delay(100, 5).then(val => {
        // this return value becomes the resolved value of the promise chain
        // that is returned from this function
        return 10;
    });
}

test().then(result => {
    // logs 10
    console.log(result);
});

当你运行它时，它会记录 10 因为 .then() 处理程序中的 return 10.

When you run it, it will log 10 because of the return 10 in the .then() handler.

.then() 处理程序有四种可能性:

There are four possibilities from a .then() handler:

1. 返回一个常规值，例如 return 10 或 return val.该值成为承诺链的已解析值.如果没有返回值(在Javascript中表示返回值为undefined)，那么promise链的解析值为undefined.

1. Return a regular value such as return 10 or return val. That value becomes the resolved value of the promise chain. If no value is returned (which in Javascript means the return value is undefined), then the resolved value of the promise chain is undefined.

返回一个最终解决或已经解决的承诺.这个承诺被添加到链中，承诺链接受该承诺的已解决值.

Return a promise that ultimately resolves or is already resolved. This promise is added to the chain and the promise chain takes on the resolved value of that promise.

返回一个最终拒绝或已经被拒绝的承诺.这个承诺被添加到链中，承诺链接受返回承诺的拒绝原因.

Return a promise that ultimately rejects or is already rejected. This promise is added to the chain and the promise chain takes on the rejected reason of the returned promise.

抛出异常.如果在 .then() 处理程序中抛出异常，则 .then()基础设施将捕获它并将承诺链变成拒绝状态，拒绝原因设置为抛出的值.因此，如果您在 .then() 处理程序中执行 throw new Error("User not found") ，那么该承诺链将被拒绝并使用该错误对象作为拒绝理由.

Throw an exception. If an exception is thrown inside the .then() handler, then the .then() infrastructure will catch it and turn the promise chain into a rejected state with the reject reason set to the value that is thrown. So, if you do throw new Error("User not found") inside a .then() handler, then that promise chain will be rejected with that error object as the reject reason.

<小时>

在您的特定代码中:

---

In your specific code:

const doAsyncOp = () => 
  $http.get(uri)
    .then(
      value => value,
      reject => //... 
    );

没有理由 value =>价值.value 已经是promise的解析值，不需要再设置.

There is no reason for the value => value. value is already the resolved value of the promise, you do not need to set it again.

并且由于胖箭头函数会自动返回任何单个语句，因此您已经在 doAsyncOp() 中返回了来自 $http.get().then() 的承诺代码>功能.所以，你可以这样做:

And since the fat arrow function automatically returns any single statement, you're already returning the promise from $http.get().then() in your doAsyncOp() function. So, you can just do:

const doAsyncOp = () => $http.get(uri);

doAsyncOp().then(result => {
   // handle the result here
}).catch(err => {
   // handle error here
});

这篇关于从 Javascript Promise 链返回值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！