一种良好且经过优化的节点异步等待代码编写样式

Question

我曾经在（样式1）中编写异步等待代码，其他开发人员建议我在（样式2）中编写代码。

有人可以向我解释两种样式之间的区别是什么，对我来说似乎是一样的。

代码样式1：

const fixtures = await fixtureModel.fetchAll();
const team = await teamModel.fetch(teamId);

代码样式2：

const fixturesPromise = fixtureModel.fetchAll();
const teamPromise = teamModel.fetch(teamId);

const fixtures = await fixturesPromise;
const team = await teamPromise;

Answer 1

它们不一样。

第一个将初始化一个Promise，等待它完成，然后初始化另一个Promise，然后等待第二个Promise完成。

第二个将立即初始化两个Promises，然后等待它们都完成。因此，将花费更少的时间。这是一个类似的例子：

// Takes twice as long as the other:

const makeProm = () => new Promise(resolve => setTimeout(resolve, 1000));

console.log('start');
(async () => {
  const foo = await makeProm();
  const bar = await makeProm();
  console.log('done');
})();

// Takes half as long as the other:

const makeProm = () => new Promise(resolve => setTimeout(resolve, 1000));

console.log('start');
(async () => {
  const fooProm = makeProm();
  const barProm = makeProm();
  const foo = await fooProm;
  const bar = await barProm;
  console.log('done');
})();

但是您可以考虑Promise.all改为使用以下代码使代码更清晰：

const [fixtures, team] = await Promise.all([
  fixtureModel.fetchAll(),
  teamModel.fetch(teamId)
]);