Блог

Учитывая следующий код:

 var arr = [1,2,3,4,5];

var results: number[] = await arr.map(async (item): Promise<number> => {
        await callAsynchronousOperation(item);
        return item   1;
    });
 

что приводит к следующей ошибке:

TS2322: Тип «Обещание<номер>[]» не может быть присвоен типу » номер []». Тип «Обещание<номер> не может быть присвоен типу «номер».

Как я могу это исправить? Как я могу создавать async await и Array.map работать вместе?

Проблема здесь в том, что вы пытаетесь выполнить await множество обещаний, а не Обещание. Это не делает того, чего вы ожидаете.

Когда переданный объект await не является обещанием, await просто возвращает значение как есть немедленно, вместо того, чтобы пытаться его разрешить. Таким образом, поскольку вы передали await здесь массив (объектов Promise) вместо обещания, значение, возвращаемое await, — это просто массив, который имеет тип Promise<number>[] .

Что вы, вероятно, хотите сделать, так это вызвать Promise.all массив, возвращаемый, map чтобы преобразовать его в одно обещание, прежде await чем вводить его.

Согласно документам MDN для Promise.all :

Promise.all(iterable) Метод возвращает обещание, которое разрешается, когда все обещания в повторяемом аргументе разрешены, или отклоняется по причине первого переданного обещания, которое отклоняется.

Так что в вашем случае:

 var arr = [1, 2, 3, 4, 5];

var results: number[] = await Promise.all(arr.map(async (item): Promise<number> => {
    await callAsynchronousOperation(item);
    return item   1;
}));
 

Это позволит устранить конкретную ошибку, с которой вы сталкиваетесь здесь.

В зависимости от того, что именно вы пытаетесь сделать , вы также можете рассмотреть Promise.allSettled возможность использования Promise.any , или Promise.race вместо Promise.all , хотя в большинстве ситуаций (почти наверняка включая эту) Promise.all это будет то, что вам нужно.

Приведенное ниже решение позволяет обрабатывать все элементы массива параллельно, асинхронно И сохранять порядок:

 const arr = [1, 2, 3, 4, 5, 6, 7, 8];
const randomDelay = () => new Promise(resolve => setTimeout(resolve, Math.random() * 1000));

const calc = async n => {
  await randomDelay();
  return n * 2;
};

const asyncFunc = async () => {
  const unresolvedPromises = arr.map(n => calc(n));
  const results = await Promise.all(unresolvedPromises);
};

asyncFunc();
 

Также кодовый ключ.

Обратите внимание, что мы только «ждем» обещания.все. Мы вызываем calc без «ожидания» несколько раз и сразу же собираем множество нерешенных обещаний. Тогда Обещай.все ожидает разрешения всех из них и возвращает массив с разрешенными значениями по порядку.

Для этого есть другое решение, если вы используете не собственные обещания, а Bluebird.

Вы также можете попробовать использовать Promise.map(), смешав массив.map и Promise.all

В твоем случае:

   var arr = [1,2,3,4,5];

  var results: number[] = await Promise.map(arr, async (item): Promise<number> => {
    await callAsynchronousOperation(item);
    return item   1;
  });
 

Если вы сопоставите массив обещаний, вы можете затем преобразовать их все в массив чисел. Смотри Обещание.все.

Вы можете использовать:

 for await (let resolvedPromise of arrayOfPromises) {
  console.log(resolvedPromise)
}
 

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for-await…of

Если вы хотите использовать Promise.all() вместо этого, вы можете пойти на Promise.allSettled() это, чтобы лучше контролировать отклоненные обещания.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/allSettled

Я бы рекомендовал использовать Promise.все, как упоминалось выше, но если вы действительно хотите избежать этого подхода, вы можете выполнить цикл » для » или любой другой цикл:

 const arr = [1,2,3,4,5];
let resultingArr = [];
for (let i in arr){
  await callAsynchronousOperation(i);
  resultingArr.push(i   1)
}
 

К вашему сведению: Если вы хотите перебирать элементы массива, а не индексы (комментарий@ralfoide), используйте of вместо in внутреннего let i in arr оператора.

Решение с использованием карты modern-async():

 import { map } from 'modern-async'

...
const result = await map(myArray, async (v) => {
    ...
})
 

Преимущество использования этой библиотеки заключается в том, что вы можете управлять параллелизмом с помощью mapLimit() или mapSeries().

У меня была задача на стороне, чтобы найти все объекты из репозитория, добавить новый URL-адрес свойства и вернуться на уровень контроллера. Вот как я этого добился (благодаря ответу Ajedi32):

 async findAll(): Promise<ImageResponse[]> {
    const images = await this.imageRepository.find(); // This is an array of type Image (DB entity)
    const host = this.request.get('host');
    const mappedImages = await Promise.all(images.map(image => ({...image, url: `http://${host}/images/${image.id}`}))); // This is an array of type Object
    return plainToClass(ImageResponse, mappedImages); // Result is an array of type ImageResponse
  }
 

Примечание: Изображение (сущность) не имеет URL-адреса свойства, но ImageResponse — имеет