Object.assign()

Baseline

Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit September 2015 browserübergreifend verfügbar.

Vollständige Kompatibilität anzeigen
Mehr erfahren

Die statische Methode Object.assign() kopiert alle enumerable own properties aus einem oder mehreren Quellobjekten in ein Zielobjekt. Sie gibt das veränderte Zielobjekt zurück.

Probieren Sie es aus

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// Expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget === target);
// Expected output: true

Syntax

Object.assign(target)
Object.assign(target, source1)
Object.assign(target, source1, source2)
Object.assign(target, source1, source2, /* …, */ sourceN)

Parameter

target: Das Zielobjekt, auf das die Eigenschaften der Quellobjekte übertragen werden. Nach der Änderung wird es zurückgegeben. Wird als Ziel ein primitiver Wert angegeben, wird er in ein Objekt umgewandelt.
source1, …, sourceN: Die Quellobjekte, deren Eigenschaften übertragen werden sollen.

Ausnahmen

TypeError

Wird in einem der folgenden Fälle ausgelöst:

Der Parameter target ist null oder undefined.
Die Zuweisung einer Eigenschaft zum Zielobjekt schlägt fehl, beispielsweise weil die Eigenschaft auf dem Zielobjekt nicht schreibbar ist oder weil ihr Setter einen Fehler auslöst.

Eigenschaften des Zielobjekts werden durch Eigenschaften der Quellobjekte überschrieben, wenn sie denselben Schlüssel haben. Eigenschaften später angegebener Quellobjekte überschreiben die zuvor angegebenen.

Die Methode Object.assign() kopiert nur enumerable und own Eigenschaften eines Quellobjekts in ein Zielobjekt. Sie verwendet [[Get]] für das Quellobjekt und [[Set]] für das Zielobjekt und ruft daher Getter und Setter auf. Sie weist Eigenschaften also zu, statt neue Eigenschaften zu kopieren oder zu definieren. Deshalb eignet sie sich möglicherweise nicht, um neue Eigenschaften in einen Prototyp einzufügen, wenn die Quellobjekte Getter enthalten.

Um Eigenschaftsdefinitionen einschließlich ihrer Aufzählbarkeit in Prototypen zu kopieren, verwenden Sie stattdessen Object.getOwnPropertyDescriptor() und Object.defineProperty().

Sowohl String- als auch Symbol-Eigenschaften werden kopiert.

Bei einem Fehler, etwa wenn eine Eigenschaft nicht schreibbar ist, wird ein TypeError ausgelöst. Das Objekt target bleibt verändert, falls vor dem Fehler bereits Eigenschaften hinzugefügt wurden.

Hinweis: Bei Quellobjekten, die null oder undefined sind, löst Object.assign() keinen Fehler aus.

Beispiele

Ein Objekt klonen

const obj = { a: 1 };
const copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

Warnung zum tiefen Klonen

Für tiefes Klonen müssen Sie Alternativen wie structuredClone() verwenden, da Object.assign() Eigenschaftswerte kopiert.

Wenn der Wert im Quellobjekt eine Referenz auf ein Objekt ist, wird nur diese Referenz kopiert.

const obj1 = { a: 0, b: { c: 0 } };
const obj2 = Object.assign({}, obj1);
console.log(obj2); // { a: 0, b: { c: 0 } }

obj1.a = 1;
console.log(obj1); // { a: 1, b: { c: 0 } }
console.log(obj2); // { a: 0, b: { c: 0 } }

obj2.a = 2;
console.log(obj1); // { a: 1, b: { c: 0 } }
console.log(obj2); // { a: 2, b: { c: 0 } }

obj2.b.c = 3;
console.log(obj1); // { a: 1, b: { c: 3 } }
console.log(obj2); // { a: 2, b: { c: 3 } }

// Deep Clone
const obj3 = { a: 0, b: { c: 0 } };
const obj4 = structuredClone(obj3);
obj3.a = 4;
obj3.b.c = 4;
console.log(obj4); // { a: 0, b: { c: 0 } }

Objekte zusammenführen

const o1 = { a: 1 };
const o2 = { b: 2 };
const o3 = { c: 3 };

const obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1); // { a: 1, b: 2, c: 3 }, target object itself is changed.

Objekte mit gleichen Eigenschaften zusammenführen

const o1 = { a: 1, b: 1, c: 1 };
const o2 = { b: 2, c: 2 };
const o3 = { c: 3 };

const obj = Object.assign({}, o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }

Eigenschaften werden durch gleichnamige Eigenschaften anderer Objekte überschrieben, die in der Parameterreihenfolge später stehen.

Eigenschaften vom Typ Symbol kopieren

const o1 = { a: 1 };
const o2 = { [Symbol("foo")]: 2 };

const obj = Object.assign({}, o1, o2);
console.log(obj); // { a : 1, [Symbol("foo")]: 2 } (cf. bug 1207182 on Firefox)
Object.getOwnPropertySymbols(obj); // [Symbol(foo)]

Eigenschaften in der Prototypenkette und nicht aufzählbare Eigenschaften können nicht kopiert werden

const obj = Object.create(
  // foo is on obj's prototype chain.
  { foo: 1 },
  {
    bar: {
      value: 2, // bar is a non-enumerable property.
    },
    baz: {
      value: 3,
      enumerable: true, // baz is an own enumerable property.
    },
  },
);

const copy = Object.assign({}, obj);
console.log(copy); // { baz: 3 }

Primitive Werte werden in Objekte umgewandelt

const v1 = "abc";
const v2 = true;
const v3 = 10;
const v4 = Symbol("foo");

const obj = Object.assign({}, v1, null, v2, undefined, v3, v4);
// Primitives will be wrapped, null and undefined will be ignored.
// Note, only string wrappers can have own enumerable properties.
console.log(obj); // { "0": "a", "1": "b", "2": "c" }

// Primitives as the target are also wrapped to objects
const number = Object.assign(3, { a: 1 });
console.log(number); // Number {3, a: 1}
console.log(typeof number); // object
console.log(number.a); // 1

// null and undefined as targets throw TypeError
try {
  Object.assign(null, { a: 1 });
} catch (e) {
  console.log(e.message); // "Cannot convert undefined or null to object"
}

Ausnahmen unterbrechen den laufenden Kopiervorgang

const target = Object.defineProperty({}, "foo", {
  value: 1,
  writable: false,
}); // target.foo is a read-only property

Object.assign(target, { bar: 2 }, { foo2: 3, foo: 3, foo3: 3 }, { baz: 4 });
// TypeError: "foo" is read-only
// The Exception is thrown when assigning target.foo

console.log(target.bar); // 2, the first source was copied successfully.
console.log(target.foo2); // 3, the first property of the second source was copied successfully.
console.log(target.foo); // 1, exception is thrown here.
console.log(target.foo3); // undefined, assign method has finished, foo3 will not be copied.
console.log(target.baz); // undefined, the third source will not be copied either.

Accessors kopieren

const obj = {
  foo: 1,
  get bar() {
    return 2;
  },
};

let copy = Object.assign({}, obj);
console.log(copy);
// { foo: 1, bar: 2 }
// The value of copy.bar is obj.bar's getter's return value.

// This is an assign function that copies full descriptors
function completeAssign(target, ...sources) {
  sources.forEach((source) => {
    const descriptors = Object.keys(source).reduce((descriptors, key) => {
      descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
      return descriptors;
    }, {});

    // By default, Object.assign copies enumerable Symbols, too
    Object.getOwnPropertySymbols(source).forEach((sym) => {
      const descriptor = Object.getOwnPropertyDescriptor(source, sym);
      if (descriptor.enumerable) {
        descriptors[sym] = descriptor;
      }
    });
    Object.defineProperties(target, descriptors);
  });
  return target;
}

copy = completeAssign({}, obj);
console.log(copy);
// { foo:1, get bar() { return 2 } }

Spezifikationen

Spezifikation
ECMAScript® 2027 Language Specification # sec-object.assign

Browser-Kompatibilität

Siehe auch

Help improve MDN

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden