Object.create() - JavaScript | MDN

Seitenleiste umschalten

Farbschema

Systemeinstellung
Hell
Dunkel

Deutsch

Sprache merken Mehr erfahren

Object.create()

Baseline Weitgehend verfügbar

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

Die Object.create() statische Methode erstellt ein neues Objekt, indem sie ein vorhandenes Objekt als Prototyp des neu erstellten Objekts verwendet.

In diesem Artikel

Probieren Sie es aus

const person = {
  isHuman: false,
  printIntroduction() {
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
  },
};

const me = Object.create(person);

me.name = "Matthew"; // "name" is a property set on "me", but not on "person"
me.isHuman = true; // Inherited properties can be overwritten

me.printIntroduction();
// Expected output: "My name is Matthew. Am I human? true"

Syntax

js
Object.create(proto)
Object.create(proto, propertiesObject)

Parameter

proto

Das Objekt, das der Prototyp des neu erstellten Objekts sein sollte.

propertiesObject Optional

Falls angegeben und nicht undefined, ein Objekt, dessen aufzählbare eigene Eigenschaften Eigenschaftsdeskriptoren angeben, die dem neu erstellten Objekt mit den entsprechenden Eigenschaftsnamen hinzugefügt werden sollen. Diese Eigenschaften entsprechen dem zweiten Argument von Object.defineProperties().

Rückgabewert

Ein neues Objekt mit dem angegebenen Prototyp-Objekt und den Eigenschaften.

Ausnahmen

TypeError

Wird ausgelöst, wenn proto weder null noch ein Object ist.

Beispiele

Klassische Vererbung mit Object.create()

Nachfolgend ist ein Beispiel, wie Object.create() verwendet wird, um klassische Vererbung zu erreichen. Dies ist für eine einzelne Vererbung, was JavaScript unterstützt.

js
// Shape - superclass
function Shape() {
  this.x = 0;
  this.y = 0;
}

// superclass method
Shape.prototype.move = function (x, y) {
  this.x += x;
  this.y += y;
  console.info("Shape moved.");
};

// Rectangle - subclass
function Rectangle() {
  Shape.call(this); // call super constructor.
}

// subclass extends superclass
Rectangle.prototype = Object.create(Shape.prototype, {
  // If you don't set Rectangle.prototype.constructor to Rectangle,
  // it will take the prototype.constructor of Shape (parent).
  // To avoid that, we set the prototype.constructor to Rectangle (child).
  constructor: {
    value: Rectangle,
    enumerable: false,
    writable: true,
    configurable: true,
  },
});

const rect = new Rectangle();

console.log("Is rect an instance of Rectangle?", rect instanceof Rectangle); // true
console.log("Is rect an instance of Shape?", rect instanceof Shape); // true
rect.move(1, 1); // Logs 'Shape moved.'

Beachten Sie, dass es Vorsichtsmaßnahmen gibt, auf die Sie bei der Verwendung von create() achten müssen, wie z.B. das erneute Hinzufügen der constructor-Eigenschaft, um die korrekten Semantiken sicherzustellen. Obwohl Object.create() als leistungsstärker als das Mutieren des Prototyps mit Object.setPrototypeOf() betrachtet wird, ist der Unterschied tatsächlich vernachlässigbar, wenn noch keine Instanzen erstellt wurden und auf Eigenschaften noch nicht optimiert zugegriffen wurde. Im modernen Code sollte in jedem Fall die class-Syntax bevorzugt werden.

Verwenden des parameters propertiesObject mit Object.create()

Object.create() ermöglicht eine fein abgestimmte Kontrolle über den Objekt-Erstellungsprozess. Die Objektinitialisierer-Syntax ist tatsächlich ein Syntaxzucker von Object.create(). Mit Object.create() können wir Objekte mit einem bestimmten Prototyp und auch mit einigen Eigenschaften erstellen. Beachten Sie, dass der zweite Parameter Schlüssel auf Eigenschaftsdeskriptoren abbildet — das bedeutet, dass Sie die Aufzählbarkeit, Konfigurierbarkeit usw. jeder Eigenschaft ebenfalls steuern können, was in Objektinitialisierern nicht möglich ist.

js
o = {};
// Is equivalent to:
o = Object.create(Object.prototype);

o = Object.create(Object.prototype, {
  // foo is a regular data property
  foo: {
    writable: true,
    configurable: true,
    value: "hello",
  },
  // bar is an accessor property
  bar: {
    configurable: false,
    get() {
      return 10;
    },
    set(value) {
      console.log("Setting `o.bar` to", value);
    },
  },
});

// Create a new object whose prototype is a new, empty
// object and add a single property 'p', with value 42.
o = Object.create({}, { p: { value: 42 } });

Mit Object.create() können wir ein Objekt mit null als Prototyp erstellen. Die entsprechende Syntax in Objektinitialisierern wäre der __proto__-Schlüssel.

js
o = Object.create(null);
// Is equivalent to:
o = { __proto__: null };

Standardmäßig sind Eigenschaften nicht schreibbar, aufzählbar oder konfigurierbar.

js
o.p = 24; // throws in strict mode
o.p; // 42

o.q = 12;
for (const prop in o) {
  console.log(prop);
}
// 'q'

delete o.p;
// false; throws in strict mode

Um eine Eigenschaft mit denselben Attributen wie in einem Initialisierer anzugeben, muss writable, enumerable und configurable explizit angegeben werden.

js
o2 = Object.create(
  {},
  {
    p: {
      value: 42,
      writable: true,
      enumerable: true,
      configurable: true,
    },
  },
);
// This is not equivalent to:
// o2 = Object.create({ p: 42 })
// which will create an object with prototype { p: 42 }

Sie können Object.create() verwenden, um das Verhalten des new-Operators nachzuahmen.

js
function Constructor() {}
o = new Constructor();
// Is equivalent to:
o = Object.create(Constructor.prototype);

Natürlich kann, wenn es tatsächlichen Initialisierungscode in der Constructor-Funktion gibt, die Object.create()-Methode diesen nicht wiedergeben.

Polyfill von Object.create in core-js
Object.defineProperty()
Object.defineProperties()
Object.prototype.isPrototypeOf()
Reflect.construct()
Object.getPrototypeOf von John Resig (2008)

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

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

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

Eingebaute Standardobjekte
Object
Konstruktor
1. Object()
Statische Methoden
Instanzmethoden
Instanzeigenschaften
1. __proto__
2. constructor
Vererbung
Object/Function
Statische Methoden
Statische Eigenschaften
Instanzmethoden
Instanzeigenschaften
1. __proto__
2. constructor