Как объединить несколько объектов в один?

Question

Я ищу способ объединить множество объектов с одним и тем же ключом в один большой объект. Количество объектов может быть больше 2.

Например, у меня есть этот код:

const a = {
  en: {
    hello: 'Hello'
  },

  fr: {
    hello: 'Bonjour'
  }
}

const b = {
  en: {
    goodbye: 'Goodbye'
  },

  fr: {
    goodbye: 'Au revoir'
  }
}

Как объединить это в это:

{
  locale: 'en',
  messages: {
    en: {
      hello: 'Hello',
      goodbye: 'Goodbye'
    },

    fr: {
      hello: 'Bonjour',
      goodbye: 'Au revoir'
    }
  }
}

Answer 1

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

Функция deepMerge работает как отдельная функция для заданной цели или как обратный вызов для Array#reduce, где массив объектов повторяется и пустой объект предоставляется как startvalue для сокращения.

В результате вам потребуется новый объект и назначьте объектам слияния новое свойство messages.

function deepMerge(target, source) {
    Object.entries(source).forEach(([key, value]) => {
        if (value && typeof value === 'object') {
            deepMerge(target[key] = target[key] || {}, value);
            return;
        }
        target[key] = value;
    });
    return target;
}

var a = { en: { hello: 'Hello' }, fr: { hello: 'Bonjour' } },
    b = { en: { goodbye: 'Goodbye' }, fr: { goodbye: 'Au revoir' } },
    c = { locale: 'en', messages: [a, b].reduce(deepMerge, {}) };
    
console.log(c);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

Попробуйте, если число объектов является динамическим:

var o, k, v, n, A=[a,b], r={}
for(o in A) for(k in A[o]) if(!r[k]) r[k]={};
for(o in A) for(v in A[o]) for(n in A[o][v]) if(!r[v][n]) r[v][n]= A[o][v][n];
console.log(r);
console.log({locale: 'en',messages:r});

Answer 3

Функция mergeArray для объединения массивов

const mergeArray = (firstArray, secondArray) => {
  return {
    locale: 'en',
    messages: {
      en: {
          ...firstArray.en,
          ...secondArray.en
      },
      fr: {
        ...firstArray.fr,
        ...secondArray.fr
      }
    }
  }
};

console.log(mergeArray(a, b));

Ниже фрагменты дают ожидаемый результат.

const value = { locale: 'en', messages: { en: { ...a.en, ...b.en }, fr: { ...a.fr, ...b.fr } }};
console.log(value)

Answer 4

Если вам нужен новый объект, вы можете использовать Object.Assign ({}, a, b)

читать это: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign