Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lernen Getter und Setter | Klassen
Fortgeschrittene JavaScript-Meisterschaft

bookGetter und Setter

Getter und Setter bieten eine leistungsstarke Möglichkeit, den Zugriff auf die Eigenschaften eines Objekts in JavaScript zu steuern.

Was sind Getter und Setter?

In JavaScript sind Getter und Setter spezielle Methoden, die einen kontrollierten Zugriff auf die Eigenschaften eines Objekts ermöglichen. Sie geben Ihnen die Flexibilität, zu definieren, wie eine Eigenschaft abgerufen und modifiziert wird, während der interne Zustand des Objekts geschützt wird.

  • Getter: Eine Methode, die verwendet wird, um den Wert einer Eigenschaft abzurufen (get);
  • Setter: Eine Methode, die verwendet wird, um den Wert einer Eigenschaft festzulegen oder zu aktualisieren.

Denken Sie an einen Banktresor. Der Tresor enthält wertvolle Gegenstände (private Eigenschaften), und der Bankangestellte (Getter/Setter) fungiert als Torwächter. Sie können nicht direkt auf den Tresor zugreifen, aber der Angestellte kann Gegenstände für Sie abrufen oder aktualisieren, basierend auf bestimmten Regeln und Validierungen.

Wie man Getter und Setter definiert und verwendet

Getter und Setter werden mit den Schlüsselwörtern get und set innerhalb einer Klasse definiert. Wenn Sie auf eine Eigenschaft zugreifen, wird der Getter automatisch aufgerufen. Ebenso wird beim Ändern einer Eigenschaft der Setter aufgerufen, anstatt die Eigenschaft direkt zu ändern.


              
12345678910111213141516171819202122232425262728293031323334

            
class Animal {
  #type; // Private field

  constructor(name, type) {
    this.name = name;
    this.#type = type; // Assigning the private field
  }

  // Getter for the type property
  get type() {
    return this.#type;
  }

  // Setter for the type property
  set type(newType) {
    if (newType) {
      this.#type = newType;
    } else {
      console.log('Invalid type');
    }
  }
}

const lion = new Animal('Lion', 'Wild');

// Using getter to access the private type
console.log(lion.type); // Output: Wild

// Using setter to modify the private type
lion.type = 'Domestic';
console.log(lion.type); // Output: Domestic

// Trying to set an invalid value
lion.type = ''; // Output: Invalid type
copy

In diesem Beispiel ist #type eine private Eigenschaft, und wir definieren einen Getter (get type()), um ihren Wert abzurufen, und einen Setter (set type(newType)), um ihn zu ändern. Der Setter enthält eine Validierung, um zu verhindern, dass ein ungültiger Wert gesetzt wird, was zeigt, wie Sie Aktualisierungen privater Daten steuern können.

Vorteile von Gettern und Settern

Kontrollierter Zugriff

  • Getter ermöglichen es Ihnen, zu definieren, wie auf den Wert einer Eigenschaft zugegriffen wird, sodass Sie den Wert verarbeiten oder manipulieren können, bevor er zurückgegeben wird;
  • Setter geben Ihnen die Kontrolle darüber, wie eine Eigenschaft aktualisiert wird, sodass Sie die Daten validieren oder transformieren können, bevor Sie sie einem privaten Feld zuweisen.

Datenschutz

  • Die Verwendung von Gettern und Settern hilft, den internen Zustand eines Objekts zu schützen, indem eine kontrollierte Schnittstelle für die Interaktion bereitgestellt wird;
  • Private Eigenschaften können verborgen bleiben, und Sie können nur die notwendigen Informationen für externen Code freigeben.

Flexibilität

Getter und Setter ermöglichen es Ihnen, zusätzliche Logik wie Validierung oder Protokollierung hinzuzufügen, wenn Sie auf Eigenschaften zugreifen oder diese ändern, ohne die Art und Weise zu ändern, wie externer Code mit dem Objekt interagiert.

Beispiel: Benutzerkonto mit Passwortvalidierung

Stellen Sie sich vor, Sie verwalten Benutzerkonten, bei denen Passwörter bestimmten Sicherheitsstandards entsprechen müssen. Mit einem Setter können Sie die Passwortstärke durchsetzen, während ein Getter eine maskierte Version des Passworts für Anzeigezwecke abrufen könnte.


              
12345678910111213141516171819202122232425262728293031323334

            
class UserAccount {
  #password; // Private field

  constructor(username, password) {
    this.username = username;
    this.#password = password;
  }

  // Getter for password (returning a masked version)
  get password() {
    return '*'.repeat(this.#password.length); // Mask the password when retrieved
  }

  // Setter for password with validation
  set password(newPassword) {
    if (newPassword.length >= 8) {
      this.#password = newPassword;
    } else {
      console.log('Password must be at least 8 characters long');
    }
  }
}

const user = new UserAccount('nick_feather', 'secret123');

// Accessing the password using the getter (masked)
console.log(user.password); // Output: *********

// Setting a new valid password using the setter
user.password = 'strongPassword123';
console.log(user.password); // Output: ***************

// Trying to set an invalid password
user.password = '123'; // Output: Password must be at least 8 characters long
copy

In diesem Beispiel gibt der Getter eine maskierte Version des Passworts zurück, um den tatsächlichen Wert zu verbergen, und der Setter erzwingt die Passwortvalidierung, um sicherzustellen, dass das Passwort mindestens 8 Zeichen lang ist.

Beispiel mit Validierungslogik unter Verwendung von Gettern und Settern

Hier ist ein weiteres Beispiel, bei dem wir das Alter einer Person verwalten und sicherstellen, dass der Wert in einem vernünftigen Bereich bleibt:


              
12345678910111213141516171819202122232425262728293031323334

            
class Person {
  #age; // Private field

  constructor(name, age) {
    this.name = name;
    this.#age = age;
  }

  // Getter for age
  get age() {
    return this.#age;
  }

  // Setter for age with validation
  set age(newAge) {
    if (newAge > 0 && newAge < 120) {
      this.#age = newAge;
    } else {
      console.log('Invalid age');
    }
  }
}

const peter = new Person('Peter', 30);

// Accessing the age using the getter
console.log(peter.age); // Output: 30

// Setting a new valid age using the setter
peter.age = 35;
console.log(peter.age); // Output: 35

// Trying to set an invalid age
peter.age = 150; // Output: Invalid age
copy

Dieses Beispiel zeigt, wie ein Setter sicherstellen kann, dass ein Alter innerhalb eines gültigen Bereichs bleibt, um zu verhindern, dass ungültige Daten gespeichert werden.

1. Was ist der Hauptzweck der Verwendung von Gettern?

2. Im folgenden Code, was wird console.log(user.password); ausgeben?

question mark

Was ist der Hauptzweck der Verwendung von Gettern?

Select the correct answer

question mark

Im folgenden Code, was wird console.log(user.password); ausgeben?

Select the correct answer

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 1. Kapitel 9

Fragen Sie AI

expand

Fragen Sie AI

ChatGPT

Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen

Suggested prompts:

Fragen Sie mich Fragen zu diesem Thema

Zusammenfassen Sie dieses Kapitel

Zeige reale Beispiele

Awesome!

Completion rate improved to 2.22

bookGetter und Setter

Swipe um das Menü anzuzeigen

Getter und Setter bieten eine leistungsstarke Möglichkeit, den Zugriff auf die Eigenschaften eines Objekts in JavaScript zu steuern.

Was sind Getter und Setter?

In JavaScript sind Getter und Setter spezielle Methoden, die einen kontrollierten Zugriff auf die Eigenschaften eines Objekts ermöglichen. Sie geben Ihnen die Flexibilität, zu definieren, wie eine Eigenschaft abgerufen und modifiziert wird, während der interne Zustand des Objekts geschützt wird.

  • Getter: Eine Methode, die verwendet wird, um den Wert einer Eigenschaft abzurufen (get);
  • Setter: Eine Methode, die verwendet wird, um den Wert einer Eigenschaft festzulegen oder zu aktualisieren.

Denken Sie an einen Banktresor. Der Tresor enthält wertvolle Gegenstände (private Eigenschaften), und der Bankangestellte (Getter/Setter) fungiert als Torwächter. Sie können nicht direkt auf den Tresor zugreifen, aber der Angestellte kann Gegenstände für Sie abrufen oder aktualisieren, basierend auf bestimmten Regeln und Validierungen.

Wie man Getter und Setter definiert und verwendet

Getter und Setter werden mit den Schlüsselwörtern get und set innerhalb einer Klasse definiert. Wenn Sie auf eine Eigenschaft zugreifen, wird der Getter automatisch aufgerufen. Ebenso wird beim Ändern einer Eigenschaft der Setter aufgerufen, anstatt die Eigenschaft direkt zu ändern.


              
12345678910111213141516171819202122232425262728293031323334

            
class Animal {
  #type; // Private field

  constructor(name, type) {
    this.name = name;
    this.#type = type; // Assigning the private field
  }

  // Getter for the type property
  get type() {
    return this.#type;
  }

  // Setter for the type property
  set type(newType) {
    if (newType) {
      this.#type = newType;
    } else {
      console.log('Invalid type');
    }
  }
}

const lion = new Animal('Lion', 'Wild');

// Using getter to access the private type
console.log(lion.type); // Output: Wild

// Using setter to modify the private type
lion.type = 'Domestic';
console.log(lion.type); // Output: Domestic

// Trying to set an invalid value
lion.type = ''; // Output: Invalid type
copy

In diesem Beispiel ist #type eine private Eigenschaft, und wir definieren einen Getter (get type()), um ihren Wert abzurufen, und einen Setter (set type(newType)), um ihn zu ändern. Der Setter enthält eine Validierung, um zu verhindern, dass ein ungültiger Wert gesetzt wird, was zeigt, wie Sie Aktualisierungen privater Daten steuern können.

Vorteile von Gettern und Settern

Kontrollierter Zugriff

  • Getter ermöglichen es Ihnen, zu definieren, wie auf den Wert einer Eigenschaft zugegriffen wird, sodass Sie den Wert verarbeiten oder manipulieren können, bevor er zurückgegeben wird;
  • Setter geben Ihnen die Kontrolle darüber, wie eine Eigenschaft aktualisiert wird, sodass Sie die Daten validieren oder transformieren können, bevor Sie sie einem privaten Feld zuweisen.

Datenschutz

  • Die Verwendung von Gettern und Settern hilft, den internen Zustand eines Objekts zu schützen, indem eine kontrollierte Schnittstelle für die Interaktion bereitgestellt wird;
  • Private Eigenschaften können verborgen bleiben, und Sie können nur die notwendigen Informationen für externen Code freigeben.

Flexibilität

Getter und Setter ermöglichen es Ihnen, zusätzliche Logik wie Validierung oder Protokollierung hinzuzufügen, wenn Sie auf Eigenschaften zugreifen oder diese ändern, ohne die Art und Weise zu ändern, wie externer Code mit dem Objekt interagiert.

Beispiel: Benutzerkonto mit Passwortvalidierung

Stellen Sie sich vor, Sie verwalten Benutzerkonten, bei denen Passwörter bestimmten Sicherheitsstandards entsprechen müssen. Mit einem Setter können Sie die Passwortstärke durchsetzen, während ein Getter eine maskierte Version des Passworts für Anzeigezwecke abrufen könnte.


              
12345678910111213141516171819202122232425262728293031323334

            
class UserAccount {
  #password; // Private field

  constructor(username, password) {
    this.username = username;
    this.#password = password;
  }

  // Getter for password (returning a masked version)
  get password() {
    return '*'.repeat(this.#password.length); // Mask the password when retrieved
  }

  // Setter for password with validation
  set password(newPassword) {
    if (newPassword.length >= 8) {
      this.#password = newPassword;
    } else {
      console.log('Password must be at least 8 characters long');
    }
  }
}

const user = new UserAccount('nick_feather', 'secret123');

// Accessing the password using the getter (masked)
console.log(user.password); // Output: *********

// Setting a new valid password using the setter
user.password = 'strongPassword123';
console.log(user.password); // Output: ***************

// Trying to set an invalid password
user.password = '123'; // Output: Password must be at least 8 characters long
copy

In diesem Beispiel gibt der Getter eine maskierte Version des Passworts zurück, um den tatsächlichen Wert zu verbergen, und der Setter erzwingt die Passwortvalidierung, um sicherzustellen, dass das Passwort mindestens 8 Zeichen lang ist.

Beispiel mit Validierungslogik unter Verwendung von Gettern und Settern

Hier ist ein weiteres Beispiel, bei dem wir das Alter einer Person verwalten und sicherstellen, dass der Wert in einem vernünftigen Bereich bleibt:


              
12345678910111213141516171819202122232425262728293031323334

            
class Person {
  #age; // Private field

  constructor(name, age) {
    this.name = name;
    this.#age = age;
  }

  // Getter for age
  get age() {
    return this.#age;
  }

  // Setter for age with validation
  set age(newAge) {
    if (newAge > 0 && newAge < 120) {
      this.#age = newAge;
    } else {
      console.log('Invalid age');
    }
  }
}

const peter = new Person('Peter', 30);

// Accessing the age using the getter
console.log(peter.age); // Output: 30

// Setting a new valid age using the setter
peter.age = 35;
console.log(peter.age); // Output: 35

// Trying to set an invalid age
peter.age = 150; // Output: Invalid age
copy

Dieses Beispiel zeigt, wie ein Setter sicherstellen kann, dass ein Alter innerhalb eines gültigen Bereichs bleibt, um zu verhindern, dass ungültige Daten gespeichert werden.

1. Was ist der Hauptzweck der Verwendung von Gettern?

2. Im folgenden Code, was wird console.log(user.password); ausgeben?

question mark

Was ist der Hauptzweck der Verwendung von Gettern?

Select the correct answer

question mark

Im folgenden Code, was wird console.log(user.password); ausgeben?

Select the correct answer

War alles klar?

Wie können wir es verbessern?

Danke für Ihr Feedback!

Abschnitt 1. Kapitel 9
some-alt