Wie kann ich die Eigenschaften von zwei JavaScript-Objekten dynamisch zusammenführen?

Question

Ich muss in der Lage sein, zwei (sehr einfache) JavaScript-Objekte zur Laufzeit zu verschmelzen. Zum Beispiel würde ich gerne:

var obj1 = { food: 'pizza', car: 'ford' }
var obj2 = { animal: 'dog' }

obj1.merge(obj2);

//obj1 now has three properties: food, car, and animal

Gibt es eine eingebaute Möglichkeit, dies zu tun? Ich brauche keine Rekursion, und ich muss nicht Funktionen zusammenführen, nur Methoden auf flache Objekte.

Answer 1

Es ist erwähnenswert, dass die Version aus dem 140byt.es Kollektion löst die Aufgabe auf kleinstem Raum und ist für diesen Zweck einen Versuch wert:

Code:

function m(a,b,c){for(c in b)b.hasOwnProperty(c)&&((typeof a[c])[0]=='o'?m(a[c],b[c]):a[c]=b[c])}

Verwendung für Ihren Zweck:

m(obj1,obj2);

Hier ist die original Gist .

Answer 2

Sie sollten lodashs defaultsDeep

_.defaultsDeep({ 'user': { 'name': 'barney' } }, { 'user': { 'name': 'fred', 'age': 36 } });
//  { 'user': { 'name': 'barney', 'age': 36 } }

Answer 3

Spread-Operator verwenden, der der ES6-Version folgt

var obj1 = { food: 'pizza', car: 'ford' }
var obj2 = { animal: 'dog' }
let result = {...obj1,...obj2};
console.log(result)

output { food: 'pizza', car: 'ford', animal: 'dog' }

Answer 4

Sie können verwenden Object.assign Methode. Zum Beispiel:

var result = Object.assign(obj1, obj2);

Beachten Sie auch, dass dabei eine flache Kopie des Objekts erstellt wird.

Answer 5

ES2018/TypeScript: Viele Antworten sind OK, aber ich habe eine elegantere Lösung für dieses Problem gefunden, wenn Sie zwei Objekte zusammenführen müssen ohne überlappende Objektschlüssel zu überschreiben .

Meine Funktion akzeptiert auch unbegrenzte Anzahl von Objekten als Funktionsargumente zusammenführen:

(Ich verwende hier TypeScript-Notation, Sie können die :object[] geben Sie das Funktionsargument ein, wenn Sie einfaches JavaScript verwenden).

const merge = (...objects: object[]) => {
  return objects.reduce((prev, next) => {
    Object.keys(prev).forEach(key => {
      next[key] = { ...next[key], ...prev[key] }
    })
    return next
  })
}