set

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Die set-Syntax bindet eine Objekteigenschaft an eine Funktion, die aufgerufen wird, wenn versucht wird, diese Eigenschaft zu setzen. Sie kann auch in Klassen verwendet werden.

Probieren Sie es aus

const language = {
  set current(name) {
    this.log.push(name);
  },
  log: [],
};

language.current = "EN";
language.current = "FA";

console.log(language.log);
// Expected output: Array ["EN", "FA"]

Syntax

js
{ set prop(val) { /* … */ } }
{ set [expression](val) { /* … */ } }

Es gibt einige zusätzliche Einschränkungen für die Syntax:

  • Ein Setter muss genau einen Parameter haben.

Parameter

prop

Der Name der Eigenschaft, die an die gegebene Funktion gebunden werden soll. Genau wie andere Eigenschaften in Objektinitialisierern kann es ein Zeichenfolgenliteral, ein Zahlenliteral oder ein Bezeichner sein.

val

Ein Alias für die Variable, die den Wert hält, der versucht wurde, prop zugewiesen zu werden.

expression

Sie können auch Ausdrücke für einen berechneten Eigenschaftsnamen verwenden, um an die gegebene Funktion zu binden.

Beschreibung

In JavaScript kann ein Setter verwendet werden, um eine Funktion auszuführen, wenn versucht wird, den Wert einer Eigenschaft zu ändern. Setter werden am häufigsten in Verbindung mit Gettern verwendet.

Eine Objekteigenschaft ist entweder eine Dateneigenschaft oder eine Zugriffseigenschaft, jedoch nicht beides gleichzeitig. Lesen Sie Object.defineProperty() für weitere Informationen. Die Setter-Syntax ermöglicht es, die Setter-Funktion in einem Objektinitialisierer anzugeben.

js
const obj = {
  set prop() {
    // setter, the code executed when setting obj.prop
  },
}

Eigenschaften, die mit dieser Syntax definiert werden, sind eigene Eigenschaften des erstellten Objekts und sie sind konfigurierbar und aufzählbar.

Beispiele

Definition eines Setters in Objektinitialisierern für neue Objekte

Das folgende Beispiel definiert eine Pseudo-Eigenschaft current des Objekts language. Wenn current ein Wert zugewiesen wird, wird log mit diesem Wert aktualisiert:

js
const language = {
  set current(name) {
    this.log.push(name);
  },
  log: [],
};

language.current = "EN";
console.log(language.log); // ['EN']

language.current = "FA";
console.log(language.log); // ['EN', 'FA']

Beachten Sie, dass current nicht definiert ist, und daher führen alle Zugriffsversuche darauf zu undefined.

Verwendung von Settern in Klassen

Sie können genau die gleiche Syntax verwenden, um öffentliche Instanz-Setter zu definieren, die auf Klasseninstanzen verfügbar sind. In Klassen benötigen Sie kein Komma-Trennzeichen zwischen den Methoden.

js
class ClassWithGetSet {
  #msg = "hello world";
  get msg() {
    return this.#msg;
  }
  set msg(x) {
    this.#msg = `hello ${x}`;
  }
}

const instance = new ClassWithGetSet();
console.log(instance.msg); // "hello world"

instance.msg = "cake";
console.log(instance.msg); // "hello cake"

Setter-Eigenschaften werden auf der prototype-Eigenschaft der Klasse definiert und daher von allen Instanzen der Klasse gemeinsam genutzt. Im Gegensatz zu Setter-Eigenschaften in Objekt-Literalen sind Setter-Eigenschaften in Klassen nicht aufzählbar.

Statische Setter und private Setter verwenden ähnliche Syntaxen, die auf den Seiten static und private properties beschrieben sind.

Entfernen eines Setters mit dem delete Operator

Wenn Sie den Setter entfernen möchten, können Sie einfach delete verwenden:

js
delete language.current;

Definition eines Setters für bestehende Objekte mit defineProperty

Um einem bestehenden Objekt einen Setter hinzuzufügen, verwenden Sie Object.defineProperty().

js
const o = { a: 0 };

Object.defineProperty(o, "b", {
  set(x) {
    this.a = x / 2;
  },
});

o.b = 10;
// Runs the setter, which assigns 10 / 2 (5) to the 'a' property

console.log(o.a); // 5

Verwendung eines berechneten Eigenschaftsnamens

js
const expr = "foo";

const obj = {
  baz: "bar",
  set [expr](v) {
    this.baz = v;
  },
};

console.log(obj.baz); // "bar"

obj.foo = "baz";
// Run the setter

console.log(obj.baz); // "baz"

Spezifikationen

Specification
ECMAScript® 2025 Language Specification
# sec-method-definitions

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
set
Computed property names

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Siehe auch