Почему задержка для async функции срабатывает только один раз?

Question

[LJ322]

let d = delay('1');

d.then( () => delay('2'))
 .then( () => delay('3'))
 .then( () => delay('4'))

async function delay(n) {
  setTimeout( () => (alert(n)), 2000)
}

Функция возвращает промис, но задержка срабатывает только для первого вызова функции. Дальше по цепочке результаты идут без задержки.
В примере ниже все задержки учитываются

let d = new Promise( (resolve) => setTimeout( () => resolve(alert('1')), 2000 ))
d.then( () => new Promise( (resolve) => setTimeout( () => resolve(alert('2')), 2000)))
  .then( () => new Promise( (resolve) => setTimeout( () => resolve(alert('3')), 2000)))
  .then( () => new Promise( (resolve) => setTimeout( () => resolve(alert('4')), 2000)))

В чём отличие вызова async функции в .then от объявления там new Promise с таким же контекстом? Где я допустил ошибку?

Answer 1

[Николай Ланец]

async function delay(n) {
  setTimeout( () => (alert(n)), 2000)
}

В данном случае async не имеет никакого смысла, потому что функция setTimeout не является асинхронной. Это обычная функция с двумя параметрами (один из них callback).

Надо так:

function delay(n) {
  return new Promise((resolve) => {
    setTimeout( () => resolve(alert(n)), 2000)
  });
}

Но это просто переделан ваш вариант. В целом такой подход, как у вас, не практикуется. Перепишите свой код.