Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lära Hantering av Egenskaper med Getters och Setters | Bemästra JavaScript-klasser och Arv
Avancerad JavaScript-mästerskap

bookHantering av Egenskaper med Getters och Setters

Getter- och setter-metoder erbjuder ett kraftfullt sätt att kontrollera åtkomst till ett objekts egenskaper i JavaScript.

Vad är getters och setters?

I JavaScript är getters och setters speciella metoder som möjliggör kontrollerad åtkomst till ett objekts egenskaper. De ger flexibilitet att definiera hur en egenskap hämtas och modifieras, samtidigt som objektets interna tillstånd skyddas.

  • Getter: En metod som används för att hämta (get) värdet av en egenskap;
  • Setter: En metod som används för att sätta eller uppdatera värdet av en egenskap.

Tänk på ett bankvalv. Valvet innehåller värdefulla föremål (privata egenskaper), och banktjänstemannen (getter/setter) fungerar som grindvakt. Du kan inte komma åt valvet direkt, men tjänstemannen kan hämta eller uppdatera föremål åt dig baserat på vissa regler och valideringar.

Hur man definierar och använder getters och setters

Getters och setters definieras med hjälp av nyckelorden get och set inuti en klass. När du kommer åt en egenskap anropas gettern automatiskt. På samma sätt, när du modifierar en egenskap, anropas settern istället för att egenskapen ändras direkt.

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 detta exempel är #type en privat egenskap, och vi definierar en getter (get type()) för att hämta dess värde samt en setter (set type(newType)) för att ändra det. Settern innehåller validering för att förhindra att ett ogiltigt värde anges, vilket visar hur du kan kontrollera uppdateringar av privat data.

Fördelar med getters och setters

Kontrollerad åtkomst

  • Getters gör det möjligt att definiera hur ett egenskapsvärde hämtas, vilket möjliggör bearbetning eller manipulering av värdet innan det returneras;
  • Setters ger kontroll över hur en egenskap uppdateras, vilket tillåter validering eller omvandling av data innan den tilldelas ett privat fält.

Dataskydd

  • Användning av getters och setters bidrar till att skydda det interna tillståndet hos ett objekt genom att erbjuda ett kontrollerat gränssnitt för interaktion;
  • Privata egenskaper kan förbli dolda, och endast nödvändig information kan exponeras för extern kod.

Flexibilitet

Getters och setters möjliggör tillägg av ytterligare logik—som validering eller loggning—vid åtkomst eller modifiering av egenskaper utan att ändra hur extern kod interagerar med objektet.

Exempel: Användarkonto med lösenordsvalidering

Föreställ dig att du hanterar användarkonton där lösenord måste uppfylla vissa säkerhetskrav. Med en setter kan du upprätthålla lösenordsstyrka, medan en getter kan hämta en maskerad version av lösenordet för visningsändamå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 det här exemplet returnerar gettern en maskerad version av lösenordet för att dölja det faktiska värdet, och settern tillämpar lösenordsvalidering, vilket säkerställer att lösenordet är minst 8 tecken långt.

Exempel med valideringslogik med hjälp av getters och setters

Här är ytterligare ett exempel där vi hanterar en persons ålder och säkerställer att värdet håller sig inom ett rimligt intervall:

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

Detta exempel visar hur en setter kan säkerställa att en ålder förblir inom ett giltigt intervall och förhindrar att ogiltiga data lagras.

1. Vad är det primära syftet med att använda getters?

2. I följande kod, vad kommer console.log(user.password); att skriva ut?

question mark

Vad är det primära syftet med att använda getters?

Select the correct answer

question mark

I följande kod, vad kommer console.log(user.password); att skriva ut?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 1. Kapitel 9

Fråga AI

expand

Fråga AI

ChatGPT

Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal

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

bookHantering av Egenskaper med Getters och Setters

Svep för att visa menyn

Getter- och setter-metoder erbjuder ett kraftfullt sätt att kontrollera åtkomst till ett objekts egenskaper i JavaScript.

Vad är getters och setters?

I JavaScript är getters och setters speciella metoder som möjliggör kontrollerad åtkomst till ett objekts egenskaper. De ger flexibilitet att definiera hur en egenskap hämtas och modifieras, samtidigt som objektets interna tillstånd skyddas.

  • Getter: En metod som används för att hämta (get) värdet av en egenskap;
  • Setter: En metod som används för att sätta eller uppdatera värdet av en egenskap.

Tänk på ett bankvalv. Valvet innehåller värdefulla föremål (privata egenskaper), och banktjänstemannen (getter/setter) fungerar som grindvakt. Du kan inte komma åt valvet direkt, men tjänstemannen kan hämta eller uppdatera föremål åt dig baserat på vissa regler och valideringar.

Hur man definierar och använder getters och setters

Getters och setters definieras med hjälp av nyckelorden get och set inuti en klass. När du kommer åt en egenskap anropas gettern automatiskt. På samma sätt, när du modifierar en egenskap, anropas settern istället för att egenskapen ändras direkt.

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 detta exempel är #type en privat egenskap, och vi definierar en getter (get type()) för att hämta dess värde samt en setter (set type(newType)) för att ändra det. Settern innehåller validering för att förhindra att ett ogiltigt värde anges, vilket visar hur du kan kontrollera uppdateringar av privat data.

Fördelar med getters och setters

Kontrollerad åtkomst

  • Getters gör det möjligt att definiera hur ett egenskapsvärde hämtas, vilket möjliggör bearbetning eller manipulering av värdet innan det returneras;
  • Setters ger kontroll över hur en egenskap uppdateras, vilket tillåter validering eller omvandling av data innan den tilldelas ett privat fält.

Dataskydd

  • Användning av getters och setters bidrar till att skydda det interna tillståndet hos ett objekt genom att erbjuda ett kontrollerat gränssnitt för interaktion;
  • Privata egenskaper kan förbli dolda, och endast nödvändig information kan exponeras för extern kod.

Flexibilitet

Getters och setters möjliggör tillägg av ytterligare logik—som validering eller loggning—vid åtkomst eller modifiering av egenskaper utan att ändra hur extern kod interagerar med objektet.

Exempel: Användarkonto med lösenordsvalidering

Föreställ dig att du hanterar användarkonton där lösenord måste uppfylla vissa säkerhetskrav. Med en setter kan du upprätthålla lösenordsstyrka, medan en getter kan hämta en maskerad version av lösenordet för visningsändamå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 det här exemplet returnerar gettern en maskerad version av lösenordet för att dölja det faktiska värdet, och settern tillämpar lösenordsvalidering, vilket säkerställer att lösenordet är minst 8 tecken långt.

Exempel med valideringslogik med hjälp av getters och setters

Här är ytterligare ett exempel där vi hanterar en persons ålder och säkerställer att värdet håller sig inom ett rimligt intervall:

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

Detta exempel visar hur en setter kan säkerställa att en ålder förblir inom ett giltigt intervall och förhindrar att ogiltiga data lagras.

1. Vad är det primära syftet med att använda getters?

2. I följande kod, vad kommer console.log(user.password); att skriva ut?

question mark

Vad är det primära syftet med att använda getters?

Select the correct answer

question mark

I följande kod, vad kommer console.log(user.password); att skriva ut?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 1. Kapitel 9
some-alt