Может ли кто-нибудь объяснить мне следующее с async / await?

Question

Может ли кто-нибудь объяснить этот код более подробно?

const promiseFactory = () =>
  new Promise(resolve => setTimeout(() => resolve(1), 5000));

Если я вызову это со следующим:

const consumer = async() => {
  promiseFactory().then(s => console.log(s));
  console.log("next step");
}

выведет "следующий шаг" и через 5 секунд, но если я вызовите его следующим образом:

const consumer = async() => {
  const val = await promiseFactory();
  console.log(val);
  console.log("next step");
}

выведет 1, а затем «следующий шаг». Итак, в конце концов обещания и async / await не просто разница в синтаксисе?

Answer 1

const consumer = async() => {
promiseFactory().then(s => console.log(s));
  console.log("next step");
}

1. Вы звоните promiseFactory
2. Вы вызываете `console.log (" следующий шаг ");
3. В какой-то момент в В будущем обещание разрешается, и вы звоните console.log(s)

const consumer = async() => {
  const val = await promiseFactory();
  console.log(val);
  console.log("next step");
}

1. Вы можете promiseFactory
2. В какой-то момент в будущем обещание разрешается, и вы звоните console.log(val), а затем console.log("next step")

---

Так что, в конце концов, обещания и асинхронность / ожидание - это не просто разница в синтаксисе?

В сущности, вы просто не пишете эквивалентный код.

Использование async и await эквивалентно:

const consumer = async () => {
    promiseFactory().then(s => {
        console.log(s);
        console.log("next step");
    );
};

с all код после await в обратном вызове then, а не только в следующей строке.

И использование then будет эквивалентно:

const consumer = async() => {
  doAsyncStuff();
  console.log("next step");
}

const doAsyncStuff = async () {
    const s = await promiseFactory();
    console.log(s)
}

Answer 2

Вы должны положить console.log("next step"); в then обещания. Javascript не останавливает выполнение. С await вы сначала ждете, затем продолжаете выполнение.

const consumer = /* you don't need the async here */ () => {
  promiseFactory().then(s => {
    console.log(s));
    console.log("next step");
  }
}