Die Schlüsselwörter get und set
Teil des Abschnitts Objektorientierte Programmierung der JavaScript-Journey von Coddy. Lektion 43 von 56.
Getter und Setter sind spezielle Methoden, die wie Eigenschaften aussehen, aber tatsächlich Funktionen sind. Sie geben dir Kontrolle darüber, wie auf Eigenschaften zugegriffen wird und wie sie geändert werden.
Erstellen wir eine einfache Person-Klasse:
class Person {
constructor(firstName, lastName) {
this._firstName = firstName;
this._lastName = lastName;
}
// Getter für fullName
get fullName() {
return `${this._firstName} ${this._lastName}`;
}
// Setter für fullName
set fullName(value) {
const parts = value.split(' ');
this._firstName = parts[0];
this._lastName = parts[1];
}
}Der Unterstrich in _firstName und _lastName ist eine Namenskonvention: Er weist andere Entwickler darauf hin, dass diese Eigenschaften intern sind und über den Getter und Setter gelesen und geändert werden sollten, nicht direkt. JavaScript erzwingt dies nicht.
Jetzt können wir diese Getter und Setter wie Eigenschaften verwenden:
// Erstelle eine neue Person
const person = new Person('John', 'Doe');
// Verwende den Getter
console.log(person.fullName); // Ausgabe: John Doe
// Verwende den Setter
person.fullName = 'Jane Smith';
// Der Setter hat die internen Eigenschaften aktualisiert
console.log(person.fullName); // Ausgabe: Jane SmithBeachte, dass wir diese Methoden nicht mit Klammern aufrufen. Sie verhalten sich wie Eigenschaften, führen aber Code aus, wenn auf sie zugegriffen oder sie geändert werden.
Aufgabe
Dir wird eine User-Klasse mit einer age-Eigenschaft gegeben. Deine Aufgabe ist es, einen Getter und Setter für age hinzuzufügen, die Folgendes tun:
- Getter
get age(): gibt das gespeicherte Alter zurück - Setter
set age(newAge): überprüft, ob das Alter zwischen 0 und 120 liegt- Wenn gültig (0-120): speichere es in
this._age - Wenn ungültig: ändere es nicht und gib
"Invalid age!"aus
- Wenn gültig (0-120): speichere es in
Probier es selbst
import { User } from './user.js';
// Testcode - nicht ändern
const user = new User("Alice", 25);
console.log(user.age); // Sollte 25 ausgeben
user.age = 30;
console.log(user.age); // Sollte 30 ausgeben
user.age = 150; // Sollte "Invalid age!" anzeigen
console.log(user.age); // Sollte weiterhin 30 ausgeben (unverändert)
Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Alle Lektionen in Objektorientierte Programmierung
1Objekte & das this-Schlüsselwort
Kurze Wiederholung: ObjekteMethoden zu Objekten hinzufügenDas this-Schlüsselwort verstehenKonstruktorfunktionenDas new-SchlüsselwortWiederholungs-Challenge7Vererbung & das extends-Schlüsselwort
VererbungDie „ist-ein“-BeziehungDas extends-SchlüsselwortDie super()-MethodeVererben von Eigenschaften & MethodenWiederholungs-Challenge10Polymorphie
Was ist Polymorphie?Geerbte Methoden überschreibenVerwendung von superWiederholungs-Challenge13Komposition vs. Vererbung
Die "hat-ein"- vs. "ist-ein"-BeziehungDie Grenzen tiefer VererbungObjekte zusammenbauen2Code organisieren
Was sind Module?Exportieren mit exportImportieren mit importDefault- vs. benannte Exports5Kapselung & Zugriff
KapselungÖffentliche & private KlassenfelderPrivate MethodenWiederholungs-Herausforderung8OOP-Code strukturieren
Klassen in Modulen organisieren11Projekt: Ein Shape-Renderer
Setup: Shape-Klasse & ExportCircle-Klasse: VererbungOverriding & Area-MethodeStatischer Shape-Zähler14Bibliotheksverwaltungssystem
Entwurf der BibliothekBuch-Klasse mit KompositionValidierung der Buchautoren3Klassen & Objekte
Was ist eine Klasse?Instanzen erstellenEigenschaften und MethodenWiederholungs-Challenge6Projekt: Ein einfaches Bankkonto
Klasse BankAccountEinzahlungen und AuszahlungenKontostand als privates Feld9Statische Methoden & Eigenschaften
Klassenebene vs. InstanzebeneStatische EigenschaftenStatische HilfsmethodenWiederholungs-Challenge12Getter & Setter
Die Schlüsselwörter get und setBerechnete EigenschaftenValidierung und SeiteneffekteWiederholungs-Challenge15Abschluss-Herausforderungen
Spielfiguren-BuilderE-Commerce ProduktsystemUniversitäts-VerwaltungssystemSmart-Home-GerätesystemÜbe selbstständig: Online-JavaScript-Compiler