Как правильно написать цепочку promise для элементов в forEach?

Question

[LJ322]

Код ниже для каждого элемента создаёт независимый промис. А как из элементов сделать цепочку?

document.querySelectorAll('li').forEach( function(li) {
      new Promise(function(resolve) {
        setTimeout( () => resolve(console.log(li.textContent)), 1000);
        })
})

Answer 1

[0xD34F]

const asyncForEach = (data, callback) =>
  Array.prototype.reduce.call(
    data,
    (promise, n, i, a) => promise.then(() => callback(n, i, a)),
    Promise.resolve()
  ).then(() => {});

// или

async function asyncForEach(data, callback) {
  for (let i = 0; i < data.length; i++) {
    await callback(data[i], i, data);
  }
}

asyncForEach(
  document.querySelectorAll('li'),
  li => new Promise(r => setTimeout(() => r(console.log(li.textContent)), 1000))
);