Was weißt du über Descriptoren?

JavaScript-Deskriptoren sind Objekte, die verschiedene Eigenschaften einer Objekteigenschaft beschreiben, wie z.B. ihren Wert (value), Schreibbarkeit (writable), Aufzählbarkeit (enumerable) und Konfigurierbarkeit (configurable). Es gibt auch Deskriptoren mit Gettern und Settern.

Es gibt zwei Arten von Deskriptoren:

• Daten-Deskriptoren: Enthalten den Wert der Eigenschaft.

  • value: Der Wert der Eigenschaft. Kann jeder gültige Datentyp sein.
  • writable: Ein boolescher Wert. Wenn true, kann der Wert der Eigenschaft geändert werden (obj.prop = newValue). Standardmäßig ist es false für Accessor-Eigenschaften und true für Daten-Eigenschaften, die durch normale Zuweisung erstellt wurden.
  • enumerable: Ein boolescher Wert. Wenn true, ist die Eigenschaft bei Iterationen über die Eigenschaften des Objekts sichtbar (z.B. in einer for...in-Schleife oder bei Verwendung von Object.keys()). Standardmäßig ist es false für mit Object.defineProperty hinzugefügte Eigenschaften und true für durch normale Zuweisung erstellte Eigenschaften.
  • configurable: Ein boolescher Wert. Wenn true, können die Eigenschaften des Deskriptors (außer value und writable, wenn sie von Daten auf Accessoren geändert werden) geändert werden, und die Eigenschaft kann gelöscht werden. Standardmäßig ist es false für mit Object.defineProperty hinzugefügte Eigenschaften (außer value) und true für durch normale Zuweisung erstellte Eigenschaften. Einmal als nicht konfigurierbar festgelegt, kann es nicht wieder geändert werden. Sie können die Schreibbarkeit von true auf false verringern, aber nicht umgekehrt bei einem nicht konfigurierbaren Getter/Setter.

• Accessoren-Deskriptoren: Definieren Funktionen, die beim Lesen (Getter) oder Schreiben (Setter) des Eigenschaftswerts aufgerufen werden.

  • get: Funktion, die beim Lesen der Eigenschaft aufgerufen wird. Das Ergebnis dieser Funktion wird zum Wert der Eigenschaft.
  • set: Funktion, die beim Schreiben in die Eigenschaft aufgerufen wird. Nimmt ein Argument, das den neuen Wert darstellt.
  • enumerable: Ein boolescher Wert (ähnlich wie bei Daten-Deskriptoren).
  • configurable: Ein boolescher Wert (ähnlich wie bei Daten-Deskriptoren).

Deskriptoren dürfen nicht gemischt werden: Eine Eigenschaft hat entweder value und writable, oder get und set.

Deskriptoren werden verwendet, um Eigenschaften eines Objekts auf einer niedrigeren Ebene als die normale Zuweisung zu steuern, insbesondere durch die Methoden Object.defineProperty(), Object.defineProperties(), Object.getOwnPropertyDescriptor(), Object.getOwnPropertyDescriptors(), Object.create().

Beispiel für die Erstellung einer Eigenschaft mit einem Daten-Deskriptor:

// Erstellen eines leeren Objekts
const obj = {};

// Definieren der Eigenschaft 'name' mit einem Daten-Deskriptor
Object.defineProperty(obj, 'name', {
  value: 'Alice',
  writable: false, // Eigenschaft kann nicht geändert werden
  enumerable: true, // Eigenschaft wird aufgelistet
  configurable: false // Eigenschaften der Eigenschaft können nicht geändert werden, Eigenschaft kann nicht gelöscht werden
});

console.log(obj.name); // Gibt aus: Alice

// Versuch, die Eigenschaft zu ändern (wird im Strict-Modus ignoriert oder Fehler auslösen)
obj.name = 'Bob';
console.log(obj.name); // Gibt aus: Alice

// Versuch, die Eigenschaft zu löschen (wird ignoriert oder Fehler auslösen)
delete obj.name;
console.log(obj.name); // Gibt aus: Alice

Beispiel für die Erstellung einer Eigenschaft mit einem Accessoren-Deskriptor:

// Erstellen eines Objekts mit einer privaten Variablen
const user = {
  _firstName: 'John', // Konventionell private Variable
  _lastName: 'Doe'
};

// Definieren der Eigenschaft 'fullName' mit einem Accessoren-Deskriptor
Object.defineProperty(user, 'fullName', {
  get() {
    // Getter: gibt den vollständigen Namen zurück
    return `${this._firstName} ${this._lastName}`;
  },
  set(value) {
    // Setter: teilt den vollständigen Namen in Teile und aktualisiert die privaten Variablen
    const parts = value.split(' ');
    this._firstName = parts[0];
    this._lastName = parts[1];
  },
  enumerable: true, // Eigenschaft wird aufgelistet
  configurable: true // Eigenschaften der Eigenschaft können geändert und Eigenschaft gelöscht werden
});

console.log(user.fullName); // Gibt aus: John Doe

user.fullName = 'Peter Pan';
console.log(user._firstName); // Gibt aus: Peter
console.log(user._lastName); // Gibt aus: Pan
console.log(user.fullName); // Gibt aus: Peter Pan

Die Verwendung von Deskriptoren ermöglicht es, unveränderliche Eigenschaften, Eigenschaften mit lazy evaluation, Zugriffskontrollierte Eigenschaften (Getter/Setter) zu erstellen und das Verhalten von Objekten flexibler zu steuern.