Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lære Håndtering af Egenskaber med Getters og Setters | Mestering af JavaScript-klasser og Arv
Avanceret JavaScript-Mestring

bookHåndtering af Egenskaber med Getters og Setters

Gettere og settere giver en effektiv metode til at kontrollere adgangen til et objekts egenskaber i JavaScript.

Hvad er gettere og settere?

I JavaScript er gettere og settere særlige metoder, der muliggør kontrolleret adgang til et objekts egenskaber. De giver fleksibilitet til at definere, hvordan en egenskab hentes og ændres, samtidig med at objektets interne tilstand beskyttes.

  • Getter: En metode, der bruges til at hente værdien af en egenskab;
  • Setter: En metode, der bruges til at sætte eller opdatere værdien af en egenskab.

Forestil dig et bankboks. Boksen indeholder værdifulde genstande (private egenskaber), og bankmedarbejderen (getter/setter) fungerer som portvagt. Du kan ikke få direkte adgang til boksen, men medarbejderen kan hente eller opdatere genstande for dig baseret på bestemte regler og valideringer.

Sådan defineres og anvendes gettere og settere

Gettere og settere defineres ved hjælp af nøgleordene get og set inde i en klasse. Når en egenskab tilgås, aktiveres getter-metoden automatisk. Tilsvarende kaldes setter-metoden, når en egenskab ændres, i stedet for at egenskaben ændres direkte.


              
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

I dette eksempel er #type en privat egenskab, og vi definerer en getter (get type()) til at hente dens værdi samt en setter (set type(newType)) til at ændre den. Setteren indeholder validering for at forhindre, at der sættes en ugyldig værdi, hvilket demonstrerer, hvordan du kan kontrollere opdateringer af private data.

Fordele ved getters og setters

Kontrolleret adgang

  • Gettere lader dig definere, hvordan en egenskabs værdi tilgås, hvilket gør det muligt at behandle eller manipulere værdien, før den returneres;
  • Settere giver dig kontrol over, hvordan en egenskab opdateres, så du kan validere eller transformere dataene, før de tildeles et privat felt.

Databeskyttelse

  • Brug af gettere og settere hjælper med at beskytte den interne tilstand af et objekt ved at tilbyde et kontrolleret interface til interaktion;
  • Private egenskaber kan forblive skjulte, og du kan kun eksponere den nødvendige information til ekstern kode.

Fleksibilitet

Gettere og settere gør det muligt at tilføje yderligere logik—såsom validering eller logning—når egenskaber tilgås eller ændres, uden at ændre hvordan ekstern kode interagerer med objektet.

Eksempel: Brugerkonto med adgangskodevalidering

Forestil dig, at du administrerer brugerkonti, hvor adgangskoder skal opfylde visse sikkerhedsstandarder. Ved at bruge en setter kan du håndhæve adgangskodestyrke, mens en getter kan hente en maskeret version af adgangskoden til visningsformål.


              
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

I dette eksempel returnerer getter'en en maskeret version af adgangskoden for at skjule den faktiske værdi, og setter'en håndhæver adgangskodevalidering, hvilket sikrer, at adgangskoden er mindst 8 tegn lang.

Eksempel med valideringslogik ved brug af getters og setters

Her er endnu et eksempel, hvor vi håndterer en persons alder og sikrer, at værdien forbliver inden for et rimeligt interval:


              
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

Dette eksempel demonstrerer, hvordan en setter kan sikre, at en alder forbliver inden for et gyldigt interval og forhindrer, at ugyldige data gemmes.

1. Hvad er det primære formål med at bruge getters?

2. I følgende kode, hvad vil console.log(user.password); udskrive?

question mark

Hvad er det primære formål med at bruge getters?

Select the correct answer

question mark

I følgende kode, hvad vil console.log(user.password); udskrive?

Select the correct answer

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 1. Kapitel 9

Spørg AI

expand

Spørg AI

ChatGPT

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Suggested prompts:

Can you explain the difference between getters and setters in more detail?

How do private fields work with getters and setters in JavaScript?

Can you provide more real-world examples of using getters and setters?

Awesome!

Completion rate improved to 2.22

bookHåndtering af Egenskaber med Getters og Setters

Stryg for at vise menuen

Gettere og settere giver en effektiv metode til at kontrollere adgangen til et objekts egenskaber i JavaScript.

Hvad er gettere og settere?

I JavaScript er gettere og settere særlige metoder, der muliggør kontrolleret adgang til et objekts egenskaber. De giver fleksibilitet til at definere, hvordan en egenskab hentes og ændres, samtidig med at objektets interne tilstand beskyttes.

  • Getter: En metode, der bruges til at hente værdien af en egenskab;
  • Setter: En metode, der bruges til at sætte eller opdatere værdien af en egenskab.

Forestil dig et bankboks. Boksen indeholder værdifulde genstande (private egenskaber), og bankmedarbejderen (getter/setter) fungerer som portvagt. Du kan ikke få direkte adgang til boksen, men medarbejderen kan hente eller opdatere genstande for dig baseret på bestemte regler og valideringer.

Sådan defineres og anvendes gettere og settere

Gettere og settere defineres ved hjælp af nøgleordene get og set inde i en klasse. Når en egenskab tilgås, aktiveres getter-metoden automatisk. Tilsvarende kaldes setter-metoden, når en egenskab ændres, i stedet for at egenskaben ændres direkte.


              
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

I dette eksempel er #type en privat egenskab, og vi definerer en getter (get type()) til at hente dens værdi samt en setter (set type(newType)) til at ændre den. Setteren indeholder validering for at forhindre, at der sættes en ugyldig værdi, hvilket demonstrerer, hvordan du kan kontrollere opdateringer af private data.

Fordele ved getters og setters

Kontrolleret adgang

  • Gettere lader dig definere, hvordan en egenskabs værdi tilgås, hvilket gør det muligt at behandle eller manipulere værdien, før den returneres;
  • Settere giver dig kontrol over, hvordan en egenskab opdateres, så du kan validere eller transformere dataene, før de tildeles et privat felt.

Databeskyttelse

  • Brug af gettere og settere hjælper med at beskytte den interne tilstand af et objekt ved at tilbyde et kontrolleret interface til interaktion;
  • Private egenskaber kan forblive skjulte, og du kan kun eksponere den nødvendige information til ekstern kode.

Fleksibilitet

Gettere og settere gør det muligt at tilføje yderligere logik—såsom validering eller logning—når egenskaber tilgås eller ændres, uden at ændre hvordan ekstern kode interagerer med objektet.

Eksempel: Brugerkonto med adgangskodevalidering

Forestil dig, at du administrerer brugerkonti, hvor adgangskoder skal opfylde visse sikkerhedsstandarder. Ved at bruge en setter kan du håndhæve adgangskodestyrke, mens en getter kan hente en maskeret version af adgangskoden til visningsformål.


              
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

I dette eksempel returnerer getter'en en maskeret version af adgangskoden for at skjule den faktiske værdi, og setter'en håndhæver adgangskodevalidering, hvilket sikrer, at adgangskoden er mindst 8 tegn lang.

Eksempel med valideringslogik ved brug af getters og setters

Her er endnu et eksempel, hvor vi håndterer en persons alder og sikrer, at værdien forbliver inden for et rimeligt interval:


              
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

Dette eksempel demonstrerer, hvordan en setter kan sikre, at en alder forbliver inden for et gyldigt interval og forhindrer, at ugyldige data gemmes.

1. Hvad er det primære formål med at bruge getters?

2. I følgende kode, hvad vil console.log(user.password); udskrive?

question mark

Hvad er det primære formål med at bruge getters?

Select the correct answer

question mark

I følgende kode, hvad vil console.log(user.password); udskrive?

Select the correct answer

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 1. Kapitel 9
some-alt