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
{ 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.
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:
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.
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:
delete language.current;
Definition eines Setters für bestehende Objekte mit defineProperty
Um einem bestehenden Objekt einen Setter hinzuzufügen, verwenden Sie Object.defineProperty()
.
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
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 GitHubdesktop | mobile | server | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
set | ||||||||||||||
Computed property names |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
Siehe auch
- Arbeiten mit Objekten Leitfaden
- Funktionen
get
Object.defineProperty()
- Objektinitialisierer
class
- Eigenschaftszugriffe
- Inkompatible ES5-Änderung: Literal-Getter- und Setter-Funktionen dürfen jetzt nur noch exakt null oder ein Argument haben von Jeff Walden (2010)
- Weitere SpiderMonkey-Änderungen: ältere, esoterische, sehr selten verwendete Syntax zur Erstellung von Gettern und Settern wird entfernt von Jeff Walden (2010)