dr.Brain

doctor Brain

мир глазами веб-разработчика

JavaScript: объединение данных

объединяем данные из различных источников для дашборда пользователя с помощью JavaScript

dr.Brain

время чтения 1 мин.

Photo by Chris Linnett on Unsplash

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

    fetchUserProfile(userId),
    fetchUserPurchases(userId),
    fetchUserActivity(userId),

Для обработки нескольких асинхронных вычислений спользуйте метод Promise.all(), который выполнится тогда, когда все полученные им промисы будут исполнены.

Чтобы убедиться, что обращения ко всем трем сторонним источникам информации (fetchUserProfile, fetchUserPurchases, fetchUserActivity) завершены, в сочетании с Promise.all(), воспользуйтесь оператором await.

После этого примените деструктуризацию с [profileData, PurchaseData, ActivityData], чтобы получить результаты обращений к сторонним API в отдельные переменные.

Наконец, спред-оператор (...), позволит создать копию ProfileData, добавив в эту копию свойства PurchaseData и ActivityData, объединив все данные вместе.

async function fetchAndMergeUserData(userId) {
  const [profileData, purchaseData, activityData] = await Promise.all([
    fetchUserProfile(userId),
    fetchUserPurchases(userId),
    fetchUserActivity(userId),
  ]);

  return { ...profileData, purchases: purchaseData, activity: activityData };
}

Еще больше информации об объекте Promise читайте на MDN.


Спасибо за внимание.

Новые публикации

Далее

Категории

О нас

Frontend & Backend. Статьи, обзоры, заметки, код, уроки.