Неожиданный Promise.all с вложенными обещаниями карты - PullRequest
Новая
       4

Неожиданный Promise.all с вложенными обещаниями карты

0 голосов
/ 01 декабря 2018

Мне нужно отобразить несколько сообщений массива через 3 секунды, используя array.map().Вот массив: 

const messages = [
    'hello', 'world', 'have', 'some', 'code'
]

Чтобы ждать на карте, я создал функцию wait. 

const wait = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve(true)
    }, 3000)
})

Затем у меня есть метод app, гдея выполнил Promise.all() следующим образом: 

const app = async () => {
    await Promise.all(messages.map(async msg => {
        await wait
        document.querySelector('#app').innerHTML += msg + ', '
    }))
}

app()

Ожидаемый результат будет ждать 3 секунды на каждой итерации карты в массиве сообщений, но он будет выводить все сообщения сразу после3 секунды!

Codepen: https://codepen.io/rakibtg/pen/xQMwYK

Что мне здесь не хватает?

1 Ответ

0 голосов
/ 01 декабря 2018

Promise.all() можно использовать для передачи списка обещаний, которые все ожидают параллельно.

Код, которым вы поделились, ждет 3 секунды для каждой итерации, за исключением того, что все эти итерации происходят вв то же время.

Если вы хотите не делать все параллельно, а просто обрабатывать по одному, вы можете переписать это в простой цикл: 

const app = async () => {
  for (const msg of messages) {
    await wait();
    document.querySelector('#app').innerHTML += msg + ', '
  }
}
...