将一个 returns foo 的承诺映射到另一个 returns bar 的承诺？

Question

我有一个生成 XMLHttpRequest 的函数，并且 return 对请求的响应作出承诺。

但是我想 return 一个只包含响应中的一个字符串的承诺。

例如，我不想 response = {status, data} 等承诺，而是 return 只是 response.data.some_field

我该怎么做？

Answer 1

如果您在一个承诺上调用 .then，您将产生另一个承诺，该承诺将解析为您在回调函数中 return 的任何内容。因此，采用您正在创建的当前承诺，然后添加以下内容：

.then((response) => {
  return response.data.some_field;
});

所以完整的函数可能如下所示：

function getStuff() {
   return new Promise((resolve, reject) => {
     //somethingWithXMLHttpRequest      
   }).then((response) => {
      return response.data.some_field;
   });
}

Answer 2

你有这样的东西（在你编辑问题之前从你的代码块中得到它）

 const promise = axios
    .post(url("fistbump"), data)
    .then(result => {
      window.console.log("Got fistbump response: ", result.data);
      localStorage.setItem(ACCOUNT_TOKEN_FIELD, result.data.key);
    });

  return promise;

如果 Axios promise 遵守 ES6 promise 规范，您可以简单地 return 您想要从 .then 子句中获取包含在 promise 中的值，这给了您

 const promise = axios
    .post(url("fistbump"), data)
    .then(result => {
      window.console.log("Got fistbump response: ", result.data);
      localStorage.setItem(ACCOUNT_TOKEN_FIELD, result.data.key);
      return result.data;
    });

  return promise;

Answer 3

您要找的是promise chaining。 Link 转到 mozilla 关于 promise 链的文档页面。

function httpRequestAsync () {
    // Return a promise... This is where your XMLHttpRequest takes place
}

function getStuffAsync() {

   // Make your http request, chain the return promise, 
   // and return a promise, which resolves to the chosen field.
   return httpRequestAsync() //Calling .then() on this promise is promise chaining.
       .then((response) => { 
          return response.data.some_field;
       });
}

function someBusinessLogicFunction () {

     let yourString = "";

     getStuffAsync()
         .then((response) => {
              yourString = response; // yourString does in fact equal the response param... :).catch(() => {
               console.log("Something went wrong, or this answer sucks ha ha!");
          }); 
     }) 
}


// Or using async/await, for fun

async someBusinessLogicFunction2 () {

     let yourString = "";

     try {
         yourString = await getStuffAsync();
     } catch (e) {
         console.log("Something went wrong, or this answer sucks ha ha!");
     }
}

我的示例将您的 HTTP 请求拆分为一个函数，声明了另一个函数，该函数调用该函数并执行承诺链接。您可以省略第二个函数，并且 return 来自执行 HTTP 请求的函数的链式承诺。

将一个 returns foo 的承诺映射到另一个 returns bar 的承诺？

Mapping a promise which returns foo, to another promise which returns bar?

javascript

vue.js

es6-promise

axios