get
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 get
-Syntax bindet eine Objekteigenschaft an eine Funktion, die aufgerufen wird, wenn auf diese Eigenschaft zugegriffen wird. Sie kann auch in Klassen verwendet werden.
Probieren Sie es aus
const obj = {
log: ["a", "b", "c"],
get latest() {
return this.log[this.log.length - 1];
},
};
console.log(obj.latest);
// Expected output: "c"
Syntax
{ get prop() { /* … */ } }
{ get [expression]() { /* … */ } }
Es gibt einige zusätzliche Syntaxeinschränkungen:
- Ein Getter muss genau null Parameter haben.
Parameter
prop
-
Der Name der Eigenschaft, die mit der angegebenen Funktion verknüpft werden soll. Ähnlich wie andere Eigenschaften in Objektinitialisierern kann es sich dabei um einen String-Literal, einen Zahlen-Literal oder einen Bezeichner handeln.
expression
-
Sie können auch Ausdrücke für einen berechneten Eigenschaftsnamen verwenden, die mit der angegebenen Funktion verknüpft werden sollen.
Beschreibung
Manchmal ist es wünschenswert, Zugriff auf eine Eigenschaft zu erlauben, die einen dynamisch berechneten Wert zurückgibt, oder Sie möchten den Status einer internen Variablen widerspiegeln, ohne explizite Methodenaufrufe zu erfordern. In JavaScript kann dies mithilfe eines Getters erreicht werden.
Eine Objekteigenschaft ist entweder eine Daten-Eigenschaft oder eine Accessor-Eigenschaft, kann jedoch nicht beides gleichzeitig sein. Lesen Sie Object.defineProperty()
für weitere Informationen. Die Getter-Syntax erlaubt es, die Getter-Funktion in einem Objektinitialisierer zu spezifizieren.
const obj = {
get prop() {
// getter, the code executed when reading obj.prop
return someValue;
},
};
Eigenschaften, die mit dieser Syntax definiert werden, sind eigene Eigenschaften des erstellten Objekts und sind konfigurierbar und aufzählbar.
Beispiele
Definition eines Getters in neuen Objekten mit Objektinitialisierern
Dies erstellt eine Pseudo-Eigenschaft latest
für das Objekt obj
, die das letzte Array-Element in log
zurückgibt.
const obj = {
log: ["example", "test"],
get latest() {
return this.log.at(-1);
},
};
console.log(obj.latest); // "test"
Beachten Sie, dass ein Versuch, einen Wert zu latest
zuzuweisen, keinen Effekt hat.
Verwendung von Gettern in Klassen
Sie können die gleiche Syntax verwenden, um öffentliche Instanz-Getter zu definieren, die in Klasseninstanzen verfügbar sind. In Klassen benötigen Sie kein Komma als Trennzeichen zwischen 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"
Getter-Eigenschaften werden auf der prototype
-Eigenschaft der Klasse definiert und sind daher von allen Instanzen der Klasse gemeinsam genutzt. Im Gegensatz zu Getter-Eigenschaften in Objektliteralen sind Getter-Eigenschaften in Klassen nicht aufzählbar.
Statische Getter und private Getter verwenden ähnliche Syntaxen, die auf den Seiten zu static
und privaten Eigenschaften beschrieben werden.
Löschen eines Getters mit dem delete
-Operator
Wenn Sie den Getter entfernen möchten, können Sie ihn einfach löschen
:
delete obj.latest;
Definition eines Getters auf bestehenden Objekten mit defineProperty
Um einem bestehenden Objekt später jederzeit einen Getter hinzuzufügen, verwenden Sie Object.defineProperty()
.
const o = { a: 0 };
Object.defineProperty(o, "b", {
get() {
return this.a + 1;
},
});
console.log(o.b); // Runs the getter, which yields a + 1 (which is 1)
Verwendung eines berechneten Eigenschaftsnamens
const expr = "foo";
const obj = {
get [expr]() {
return "bar";
},
};
console.log(obj.foo); // "bar"
Definition von statischen Gettern
class MyConstants {
static get foo() {
return "foo";
}
}
console.log(MyConstants.foo); // 'foo'
MyConstants.foo = "bar";
console.log(MyConstants.foo); // 'foo', a static getter's value cannot be changed
Intelligente / sich selbst überschreibende / verzögerte Getter
Getter bieten Ihnen die Möglichkeit, eine Eigenschaft eines Objekts zu definieren, berechnen jedoch den Wert der Eigenschaft erst, wenn darauf zugegriffen wird. Ein Getter verschiebt die Berechnungskosten des Werts, bis der Wert benötigt wird. Falls er nie benötigt wird, entstehen keine Kosten.
Eine zusätzliche Optimierungstechnik, um die Berechnung eines Eigenschaftswerts zu verzögern oder zu verzögern und ihn für späteren Zugriff zwischenzuspeichern, sind intelligente (oder memoisierte) Getter. Der Wert wird beim ersten Aufruf des Getters berechnet und anschließend zwischengespeichert, sodass nachfolgende Zugriffe auf den zwischengespeicherten Wert zurückgreifen, ohne ihn neu zu berechnen. Diese Technik ist in folgenden Situationen nützlich:
- Wenn die Berechnung eines Eigenschaftswertes teuer ist (viel RAM oder CPU-Zeit benötigt, Worker-Threads startet, eine Remote-Datei abruft usw.).
- Wenn der Wert jetzt nicht benötigt wird. Er wird später verwendet, oder in manchen Fällen wird er überhaupt nicht verwendet.
- Wenn er verwendet wird, wird er mehrmals abgerufen, und es besteht keine Notwendigkeit, den unveränderlichen Wert neu zu berechnen.
Hinweis: Dies bedeutet, dass Sie keinen verzögerten Getter für eine Eigenschaft schreiben sollten, deren Wert Sie erwarten, dass er sich ändert. Ein verzögerter Getter berechnet den Wert nicht neu.
Beachten Sie, dass Getter von Natur aus nicht „verzögert“ oder „memoisiert“ sind; Sie müssen diese Technik implementieren, wenn Sie dieses Verhalten wünschen.
Im folgenden Beispiel hat das Objekt einen Getter als eigene Eigenschaft. Beim Abrufen der Eigenschaft wird die Eigenschaft aus dem Objekt entfernt und erneut hinzugefügt, diesmal jedoch implizit als Daten-Eigenschaft. Abschließend wird der Wert zurückgegeben.
const obj = {
get notifier() {
delete this.notifier;
this.notifier = document.getElementById("bookmarked-notification-anchor");
return this.notifier;
},
};
get vs. defineProperty
Während die Verwendung des get
-Schlüsselworts und Object.defineProperty()
ähnliche Ergebnisse liefert, gibt es einen subtilen Unterschied zwischen den beiden, wenn sie auf classes
angewendet werden.
Bei der Verwendung von get
wird die Eigenschaft auf dem Prototyp der Instanz definiert, während bei der Verwendung von Object.defineProperty()
die Eigenschaft auf der Instanz selbst definiert wird, auf die sie angewendet wird.
class Example {
get hello() {
return "world";
}
}
const obj = new Example();
console.log(obj.hello);
// "world"
console.log(Object.getOwnPropertyDescriptor(obj, "hello"));
// undefined
console.log(
Object.getOwnPropertyDescriptor(Object.getPrototypeOf(obj), "hello"),
);
// { configurable: true, enumerable: false, get: function get hello() { return 'world'; }, set: undefined }
Spezifikationen
Specification |
---|
ECMAScript® 2025 Language Specification # sec-method-definitions |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | server | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
get | ||||||||||||||
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
set
Object.defineProperty()
- Objektinitialisierer
class
- Eigenschafts-Accessor
- Inkompatible ES5-Änderung: literal getter and setter functions must now have exactly zero or one arguments von Jeff Walden (2010)
- Mehr SpiderMonkey-Änderungen: ancient, esoteric, very rarely used syntax for creating getters and setters is being removed von Jeff Walden (2010)