Question

基本上，我可以保证在一个循环中有多个API调用，该循环将结果附加到数组中，而数组又由Promise.all解决。但是，代码似乎从不将数组的值返回到Promise.all，而仅返回未解决的承诺。

这是转载的代码-

function func1(data) {

return new Promise(function(resolve, reject) {
  var arr1 = data.split(". ");
  var another_arr = arr1.map(function(sent) {
    fetch('https://pokeapi.co/api/v2/pokemon/1/')
      .then(function(response) {
        return response.json();
      })
  })
  resolve(Promise.all(another_arr))
})
}

function func_main() {
  var some_string = "This is a sentence. This is another sentence."
  this.func1(some_string).then(function(value) {
  console.log(value)
})
}

func_main()

https://jsbin.com/vemasopojo/edit?js,console

输出：[undefined, undefined]

在继续打印之前，如何确保阵列完全解析？

Answer 1

Promise.all期望一个Promise数组，并且map回调函数应返回将被映射到新数组的值。

实际上，您正在传递未定义对象的数组，因为您的map函数根本不返回任何东西。

您应该返回fetch调用以使其起作用

var another_arr = arr1.map(function(sent) {
   return fetch('https://pokeapi.co/api/v2/pokemon/1/')
    .then(function(response) {
      return response.json();
    })
  })

documentation

Answer 2

您在内部异步调用之外调用resolve，这意味着它被过早调用。

尝试以下方法：

function func1(data) {
  return new Promise(function(resolve, reject) {
    var arr1 = data.split(". ");
    var another_arr = arr1.map(function(sent) {
      fetch('https://pokeapi.co/api/v2/pokemon/1/')
        .then(function(response) {
          resolve(response.json())
      })
    })
  })
}

感觉应该有一种更优雅的方法来做到这一点，但这应该可以为您提供所需的数据，无论如何。

Answer 3

您的问题是map函数内缺少return语句。没有return语句，它将返回undefined。只需将return放在提取之前：

return fetch('https://pokeapi.co/api/v2/pokemon/1/')
  .then(...

您还应该避免使用Promise构造函数。您在那里不需要它，只需直接返回Promise.all创建的Promise：

function func1(data) {
  var arr1 = data.split(". ");
  var another_arr = arr1.map(function(sent) {
    return fetch('https://pokeapi.co/api/v2/pokemon/1/')
      .then(function(response) {
        return response.json();
      });
    });
  return Promise.all(another_arr);
}

如何在Promise中处理异步代码？

3 个答案: