Question

我有一些数据数组，希望每个人都能获取一些信息。

我想在进程启动时记录控制台，并在完成时记录数据，但是结果给我的数据与初始化时相同。

我曾尝试使用async / await，但它没有按预期工作。

这是我的代码

const data = [
  {
    name: 'User 1',
    detail: 0
  },
  {
    name: 'User 2',
    detail: 0
  },
  {
    name: 'User 3',
    detail: 0
  }
];

function getDetail() {
  setTimeout(() =>  {
        return "Detail Test";
   }, 3000);
}

async function mapping() {
  await Promise.all(data.map(async (item) => {
    item.detail = await getDetail();
  }))
}


console.log("Start");
mapping();
console.log(data);

结果仍然相同。

[
  {
    name: 'User 1',
    detail: 0
  },
  {
    name: 'User 2',
    detail: 0
  },
  {
    name: 'User 3',
    detail: 0
  }
]

我的期望

[
  {
    name: 'User 1',
    detail: "Detail Test"
  },
  {
    name: 'User 2',
    detail: "Detail Test"
  },
  {
    name: 'User 3',
    detail: "Detail Test"
  }
]

Answer 1

您的代码存在3个问题：

getDetail应该返回一个承诺，让await实际等待。

const getDetail = () => new Promise((resolve) => {
  setTimeout(() =>  {
        resolve("Detail Test");
   }, 3000);
}

Array.map不会修改原始数组，强烈建议这样做，但是为了回答您的问题：

async function mapping() {
  await Promise.all(data.map(async (item, i) => {
    data[i].detail = await getDetail();
  }))
}

最后，您要等待映射生效以使更改生效：

async function run() {
  console.log("Start");
  await mapping();
  console.log(data);
};

run();

这是工作中的pen

有没有办法等待诺言才能继续？

1 个答案: