Как объединить два объекта с одинаковым значением?

У меня есть два объекта с одинаковыми ключами, но разными значениями, вот пример, с которым я борюсь:

obj1 = {
     "cars": ["nissan","toyota","hyundai"],
     "color": ["red","black","white"], 
}
obj2 = {
     "cars": ["gmc","ford","chevrolet"],
     "color": ["orange","blue","grey"], 
}

Я пробовал использовать оба:

Object.assign(obj1,obj2)

И:

let merge1 = {...obj1,...obj2}

Но вывод всегда:

{
     "cars": [         "gmc",         "ford",         "chevrolet"     ],
     "color": [         "orange",         "blue",         "grey"     ] 
}

Желаемый результат:

{
     "cars": [         "nissan",         "toyota",         "hyundai"         "gmc",         "ford",         "chevrolet"     ],
     "color": [         "red",         "black",         "white"         "orange",         "blue",         "grey"     ] 
}

Object.assign и оператор распространения — это только поверхностное копирование/слияние. Если вы хотите объединить массивы, вам нужно будет закодировать этот бит. Массивы можно легко сделать с помощью Set..

— 22.02.2023 12:08

Для этого нет встроенного синтаксиса или метода. Вам нужно будет перебрать записи и объединить массивы.

— 22.02.2023 12:08

javascript

22.02.2023 12:03

Как собрать/развернуть часть вашего приложения Angular

Вам когда-нибудь требовалось собрать/развернуть только часть вашего приложения Angular или, возможно, скрыть некоторые маршруты в определенных средах?

Оптимизация React Context шаг за шагом в 4 примерах

При использовании компонентов React в сочетании с Context вы можете оптимизировать рендеринг, обернув ваш компонент React в React.memo сразу после...

Интервьюер: Почему '[] instanceof Object' возвращает "true"?

Все мы знаем, что [] instanceof Array возвращает true, но почему [] instanceof Object тоже возвращает true?

Абстрактное синтаксическое дерево (AST) и как оно работает с ReactJS

Абстрактное синтаксическое дерево (AST) - это древовидная структура данных, которая представляет структуру и иерархию исходного кода на языке...

Хук useReducer в react

3 эффективных способа найти максимальное значение в массивах JavaScript

Перейти к ответу Данный вопрос помечен как решенный

Ответы 4

obj1 = {
 "cars": ["nissan","toyota","hyundai"],
 "color": ["red","black","white"], 
}
obj2 = {
     "cars": ["gmc","ford","chevrolet"],
     "color": ["orange","blue","grey"], 
}
const merge = {
    cars: [...obj1.cars, ...obj2.cars],
    color: [...obj1.color, ...obj2.color]
}

22.02.2023 12:11

Вы можете сделать это, захватив ключи первого объекта, а затем перестроив объект с объединенными массивами из каждого объекта, используя Object.fromEntries и Array#flat:

const obj1 = {
     "cars": ["nissan", "toyota", "hyundai"],
     "color": ["red", "black", "white"], 
}
const obj2 = {
     "cars": ["gmc", "ford", "chevrolet"],
     "color": ["orange", "blue", "grey"], 
}

const combineObjArrays = (objs) => {
    const keys = Object.keys(objs[0])

    return Object.fromEntries(
        keys.map((key) => [
            key,
            objs.map((obj) => obj[key]).flat()
        ])
    )
}

console.info(combineObjArrays([obj1, obj2]))

Если вы собираетесь map().flat() использовать flatMap()

— 22.02.2023 12:17

22.02.2023 12:15

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

Когда вы распространяете или назначаете два объекта другому, значения из второго объекта перезаписывают значения из первого объекта.

Если вы хотите объединить значения, вам нужно выполнить итерацию по объекту, объединяющему соответствующие значения, например:

const obj1 = {
     "cars": ["nissan", "toyota", "hyundai"],
     "color": ["red", "black", "white"],
}
const obj2 = {
     "cars": ["gmc", "ford", "chevrolet"],
     "color": ["orange", "blue", "grey"],
}

let combinedObj = {}

for (const key of Object.keys(obj1)) {
     const obj1KeyValue = obj1[key]
     const obj2KeyValue = obj1[key]

     if (Array.isArray(obj1KeyValue) && Array.isArray(obj2KeyValue)){
          combinedObj[key] = [...obj1KeyValue, ...obj2KeyValue]
     }
}

console.info(combinedObj)
//displays
//{
//  cars: [ 'nissan', 'toyota', 'hyundai', 'nissan', 'toyota', 'hyundai' ],
//  color: [ 'red', 'black', 'white', 'red', 'black', 'white' ]
//}

22.02.2023 12:16

Я думаю, что это лучшее решение сделать это с помощью for loop.

const obj1 = {
  "cars": ["nissan", "toyota", "hyundai"],
  "color": ["red", "black", "white"],
};

const obj2 = {
  "cars": ["gmc", "ford", "chevrolet"],
  "color": ["orange", "blue", "grey"],
};

let merged = obj1

for (let key of Object.keys(obj2)) {
    if (!obj1[key]){
        merged[key] = obj2[key]
    }
}

Он перебирает obj2 и проверяет, включен ли уже ключ в obj1. Если нет, ключ добавляется. Переменная merged содержит результат.

22.02.2023 12:19