在节点 js/javascript 中的地图函数之外获取异步等待数据

Question

 let object = [{ id: `01`, name: `fish`, type: `marine`, }, { id: `02`, name: `fish`, type: `fresh`, }, { id: `03`, name: `fish`, type: `tank`, }, { id: `04`, name: `animal`, type: `pet`, }, { id: `05`, name: `animal`, type: `wild`, }, { id: `06`, name: `animal`, type: `zoo`, }, { id: `07`, name: `food`, type: `veg`, }, { id: `08`, name: `food`, type: `non-veg`, }] let data = [] object.map((value) => { data.push([value.name, value.type]) }) console.log(data)

在第一个示例中，我可以在 map 函数之外获取数据，但在第二个示例中，我无法获取数据

 let object = [{ id: `01`, name: `fish`, type: `marine`, }, { id: `02`, name: `fish`, type: `fresh`, }, { id: `03`, name: `fish`, type: `tank`, }, { id: `04`, name: `animal`, type: `pet`, }, { id: `05`, name: `animal`, type: `wild`, }, { id: `06`, name: `animal`, type: `zoo`, }, { id: `07`, name: `food`, type: `veg`, }, { id: `08`, name: `food`, type: `non-veg`, }] let data=[]; let test; object.map(async (value) => { test = await getValue(value.name); data.push([value.name,value.type,test]); }) console.log(data);

正如在第一个示例中，我可以轻松地在第二个函数中获取 map 函数之外的数据 我得到的是空白数组 如何在 map 函数之外获取异步等待数据

• 我哪里做错了我不明白

Answer 1

 let object = [{ id: `01`, name: `fish`, type: `marine`, }, { id: `02`, name: `fish`, type: `fresh`, }, { id: `03`, name: `fish`, type: `tank`, }, { id: `04`, name: `animal`, type: `pet`, }, { id: `05`, name: `animal`, type: `wild`, }, { id: `06`, name: `animal`, type: `zoo`, }, { id: `07`, name: `food`, type: `veg`, }, { id: `08`, name: `food`, type: `non-veg`, }] async function demo(){ let data=[]; let test; for( const value of object){ test = await getValue(value.name); data.push([value.name,value.type,test]); } console.log(data); }

试试这个我希望这会起作用，因为你必须在for循环中编写代码，你试图实现它会起作用

Answer 2

试试这个，你会很容易得到你的响应 viva for 循环。 Map 函数使用回调函数，在给定数组的每个元素上遍历该函数。 有关更多详细信息，请通过此async/await for Array.map 功能，也可以使用 promise.all 与给定链接中的帖子中提到的相同。

 let object= [ { id:`01`, name:`fish`, type:`marine`, }, { id:`02`, name:`fish`, type:`fresh`, }, { id:`03`, name:`fish`, type:`tank`, }, { id:`04`, name:`animal`, type:`pet`, }, { id:`05`, name:`animal`, type:`wild`, }, { id:`06`, name:`animal`, type:`zoo`, }, { id:`07`, name:`food`, type:`veg`, }, { id:`08`, name:`food`, type:`non-veg`, } ] const getData = async function(){ let data=[]; for (var i=0; i<object.length; i++){ let value = object[i]; let test= await getValue(value.name); data.push([value.name,value.type,test]); } return data; } console.log(await getData());

Answer 3

使用Promise.all ：

const data = await Promise.all(object.map(async (value) => {
  const test = await getValue(value.name);
  return [value.name,value.type,test]
}))

console.log(data)

Answer 4

请注意，map 函数生成一个 Promise 对象作为每个项目的返回值。

data完成收集所有数据的时刻应该在所有 Promise 完成之后。

因此，为确保过程完成，请在使用data之前使用await Promise.all() 。

 let object = [{ id: `01`, name: `fish`, type: `marine`, }, { id: `02`, name: `fish`, type: `fresh`, }, { id: `03`, name: `fish`, type: `tank`, }, { id: `04`, name: `animal`, type: `pet`, }, { id: `05`, name: `animal`, type: `wild`, }, { id: `06`, name: `animal`, type: `zoo`, }, { id: `07`, name: `food`, type: `veg`, }, { id: `08`, name: `food`, type: `non-veg`, }] let data=[]; let test; let promises = object.map(async (value) => { test = await getValue(value.name); data.push([value.name,value.type,test]); }) // 1. This line matters await Promise.all(promises); console.log(data); // 2. Or if you cannot use await here Promise.all(promises).then(() => { console.log(data); });

顺便说一下，因为getValue函数是异步的，所以你可能会以完全随机的顺序获取数据，如果你关心顺序，你可能需要另一种方法。