Kursinhalt
Fortgeschrittene JavaScript-Meisterschaft
Fortgeschrittene JavaScript-Meisterschaft
1. Klassen
Willkommen Zum KursKlassendeklarationHerausforderung: Eine Klasse ErstellenKlassenmethodenHerausforderung: Methoden zu einer Klasse HinzufügenParameterobjektPrivate EigenschaftenHerausforderung: Implementierung Privater Properties in Einer KlasseGetter und SetterHerausforderung: Verwalten von Eigenschaften mit Getters und SettersStatische EigenschaftenStatische MethodenHerausforderung: Verwenden von Statischen Eigenschaften und Methoden in Einer KlasseVererbung mit Extends und Verwendung von Super()Herausforderung: Klassenvererbung mit extends und Verwendung von super
2. DOM-Manipulation
Was Ist das DOM?Abfragen des DOMHerausforderung: Abfragen des DOMVerstehen der DOM-HierarchieHerausforderung: DOM-HierarchieDOM-EigenschaftenArbeiten mit Element-AttributenHerausforderung: Arbeiten mit Element-Eigenschaften und -AttributenElemente HinzufügenElemente EntfernenHerausforderung: Hinzufügen und Entfernen von ElementenÄndern von ElementstilenHerausforderung: Ändern von Elementstilen
4. Asynchrones JavaScript und APIs
Herausforderung: Implementierung Privater Properties in Einer Klasse
Aufgabe
Sie erstellen eine BankAccount
-Klasse, um die Bankkonten der Benutzer sicher zu verwalten. Jedes Konto hat einen Besitzer und ein Guthaben, aber Sie möchten, dass das Guthaben vor direktem Zugriff geschützt ist. Ihr Ziel ist es, private Eigenschaften zu verwenden, um unbeabsichtigte Änderungen am Guthaben zu verhindern, während ein kontrollierter Zugriff über Methoden ermöglicht wird.
- Private Guthabeneigenschaft:
- Deklarieren Sie innerhalb der
BankAccount
-Klasse eine private Eigenschaft#balance
.
- Deklarieren Sie innerhalb der
- Konstruktor:
- Der Konstruktor sollte
owner
undinitialBalance
als Parameter akzeptieren; - Weisen Sie
owner
einer öffentlichen Eigenschaft undinitialBalance
der privaten#balance
-Eigenschaft zu.
- Der Konstruktor sollte
- Methoden hinzufügen:
- deposit: Definieren Sie eine Methode, die
amount
als Parameter nimmt. Wenn der Betrag größer als 0 ist, sollte eramount
zu#balance
hinzufügen; - withdraw: Definieren Sie eine Methode, die
amount
als Parameter nimmt. Wenn der Betrag größer als 0 und kleiner oder gleich#balance
ist, sollte eramount
von#balance
abziehen; - getBalance: Definieren Sie eine Methode, die einen String mit dem Namen des Besitzers und dem Kontostand zurückgibt, z.B.
"Kontostand für John: $1500"
.
- deposit: Definieren Sie eine Methode, die
class BankAccount { #_____; // Declare private property constructor(owner, initialBalance) { this._____ = owner; this.#_____ = initialBalance; } deposit(_____) { if (_____) { this.#_____ += _____; } } withdraw(_____) { if (_____ && _____) { this.#_____ -= _____; } } getBalance() { return `Account balance for ${this._____}: $${this.#_____}`; } } // Testing const account1 = new BankAccount('Alice', 1000); account1.deposit(500); console.log(account1.getBalance()); // Expected: Account balance for Alice: $1500 account1.withdraw(300); console.log(account1.getBalance()); // Expected: Account balance for Alice: $1200 // Attempt direct access (should cause an error) // console.log(account1.#balance);
- Deklariere eine private Eigenschaft
#balance
in derBankAccount
-Klasse; - Weise im Konstruktor
owner
einer öffentlichen Eigenschaft undinitialBalance
der privaten#balance
-Eigenschaft zu; - Definiere eine
deposit
-Methode, dieamount
als Parameter nimmt. Überprüfe, obamount
größer als 0 ist, und addiere dannamount
zu#balance
; - Definiere eine
withdraw
-Methode, dieamount
als Parameter nimmt. Überprüfe, obamount
größer als 0 und kleiner oder gleich#balance
ist, und subtrahiere dannamount
von#balance
; - Definiere eine
getBalance
-Methode, die einen String mit dem Namen des Besitzers und dem Kontostand zurückgibt.
class BankAccount { #balance; // Declare private property constructor(owner, initialBalance) { this.owner = owner; this.#balance = initialBalance; } deposit(amount) { if (amount > 0) { this.#balance += amount; } } withdraw(amount) { if (amount > 0 && amount <= this.#balance) { this.#balance -= amount; } } getBalance() { return `Account balance for ${this.owner}: $${this.#balance}`; } } // Testing const account1 = new BankAccount('Alice', 1000); account1.deposit(500); console.log(account1.getBalance()); // Output: Account balance for Alice: $1500 account1.withdraw(300); console.log(account1.getBalance()); // Output: Account balance for Alice: $1200 // Attempt direct access (should cause an error) // console.log(account1.#balance);
War alles klar?
Danke für Ihr Feedback!
Abschnitt 1. Kapitel 8