Как я могу объединить два массива объектов, возможно, разной длины, отфильтровав некоторые значения на основе свойства

Скажем, у меня есть два массива, подобные следующим:

const arr1 = [
    {id:1, value:25},
    {id:2, value:15},
    {id:3, value:35}
];

const arr2 = [
    {id:3, value:95},
    {id:4, value:65}
];

И мне нужен третий массив, включающий 3 элемента с уникальными идентификаторами, но для двух объектов с повторяющимися идентификаторами (id: 3) я хочу сохранить один и тот же идентификатор и добавить значения. В итоге что-то вроде...

const arr3 = [
    {id:1, value:25},
    {id:2, value:15},
    {id:3, value:130},
    {id:4, value:65},
];

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

что пойдет не так?

Nina Scholz 23.11.2022 20:32
const arr3 = Array.from([ ...arr1, ...arr2 ].reduce((idToSum, { id, value }) => idToSum.set(id, (idToSum.get(id) ?? 0) + value), new Map()), ([ id, value ]) => ({ id, value }));.
Sebastian Simon 23.11.2022 20:35

@NinaScholz - я пытался сопоставить один из массивов и использовать .includes для поиска дубликатов, но сначала мне нужно сравнить свойство в объектах массива, а не сами объекты. А во-вторых, массивы могут быть разной длины.

Billies Wesley 23.11.2022 20:37
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
3
83
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы можете использовать простой объект js для отслеживания ids, чтобы вы могли искать id в O(1) времени, независимо от того, используется он уже или нет.

  1. Объединить два массива
  2. Переберите объединенный массив и создайте словарь, используя reduce()
  3. В каждой итерации ищите id в словаре или нет. если идентификатор отсутствует, мы вставляем новый ключ как id и значение как {id, value}. и если ключ присутствует, нам нужно добавить предыдущее значение с новым значением и, наконец, обновить его.

const arr1 = [ {id:1, value:25}, {id:2, value:15}, {id:3, value:35} ]; 
const arr2 = [ {id:3, value:95}, {id:4, value:65} ];
 
const res = [...arr1, ...arr2].reduce((a, {id, value}) => ({...a, [id]: a[id] ? {id, value: a[id].value + value} : {id, value}}), {});

console.info(Object.values(res));

Другие вопросы по теме