Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Вивчайте Managing Properties with Getters and Setters | Mastering JavaScript Classes and Inheritance
Advanced JavaScript Mastery

bookManaging Properties with Getters and Setters

Getters and setters provide a powerful way to control access to an object's properties in JavaScript.

What Are Getters and Setters?

In JavaScript, getters and setters are special methods that allow controlled access to an object's properties. They give you the flexibility to define how a property is retrieved and modified while protecting the object's internal state.

  • Getter: A method used to retrieve (get) the value of a property;
  • Setter: A method used to set or update the value of a property.

Think of a bank vault. The vault holds valuable items (private properties), and the bank teller (getter/setter) acts as the gatekeeper. You can't access the vault directly, but the teller can retrieve or update items for you based on certain rules and validations.

How to Define and Use Getters and Setters

Getters and setters are defined using the get and set keywords inside a class. When you access a property, the getter is automatically invoked. Similarly, when you modify a property, the setter is called instead of directly modifying the property.


              
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 this example, #type is a private property, and we define a getter (get type()) to retrieve its value and a setter (set type(newType)) to modify it. The setter includes validation to prevent setting an invalid value, demonstrating how you can control updates to private data.

Benefits of Getters and Setters

Controlled Access

  • Getters let you define how a property's value is accessed, enabling you to process or manipulate the value before returning it;
  • Setters give you control over how a property is updated, allowing you to validate or transform the data before assigning it to a private field.

Data Protection

  • Using getters and setters helps safeguard the internal state of an object by providing a controlled interface for interaction;
  • Private properties can remain hidden, and you can expose only the necessary information to external code.

Flexibility

Getters and setters allow you to add additional logic—like validation or logging—when accessing or modifying properties without altering how external code interacts with the object.

Example: User Account with Password Validation

Imagine you are managing user accounts where passwords need to meet certain security standards. Using a setter, you can enforce password strength, while a getter could retrieve a masked version of the password for display purposes.


              
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 this example, the getter returns a masked version of the password to hide the actual value, and the setter enforces password validation, ensuring the password is at least 8 characters long.

Example with Validation Logic Using Getters and Setters

Here's another example where we manage a person's age and ensure that the value stays within a reasonable range:


              
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

This example demonstrates how a setter can ensure that an age remains within a valid range, preventing invalid data from being stored.

1. What is the primary purpose of using getters?

2. In the following code, what will console.log(user.password); output?

question mark

What is the primary purpose of using getters?

Select the correct answer

question mark

In the following code, what will console.log(user.password); output?

Select the correct answer

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 1. Розділ 9

Запитати АІ

expand

Запитати АІ

ChatGPT

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Suggested prompts:

Запитайте мені питання про цей предмет

Сумаризуйте цей розділ

Покажіть реальні приклади

Awesome!

Completion rate improved to 2.22

bookManaging Properties with Getters and Setters

Свайпніть щоб показати меню

Getters and setters provide a powerful way to control access to an object's properties in JavaScript.

What Are Getters and Setters?

In JavaScript, getters and setters are special methods that allow controlled access to an object's properties. They give you the flexibility to define how a property is retrieved and modified while protecting the object's internal state.

  • Getter: A method used to retrieve (get) the value of a property;
  • Setter: A method used to set or update the value of a property.

Think of a bank vault. The vault holds valuable items (private properties), and the bank teller (getter/setter) acts as the gatekeeper. You can't access the vault directly, but the teller can retrieve or update items for you based on certain rules and validations.

How to Define and Use Getters and Setters

Getters and setters are defined using the get and set keywords inside a class. When you access a property, the getter is automatically invoked. Similarly, when you modify a property, the setter is called instead of directly modifying the property.


              
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 this example, #type is a private property, and we define a getter (get type()) to retrieve its value and a setter (set type(newType)) to modify it. The setter includes validation to prevent setting an invalid value, demonstrating how you can control updates to private data.

Benefits of Getters and Setters

Controlled Access

  • Getters let you define how a property's value is accessed, enabling you to process or manipulate the value before returning it;
  • Setters give you control over how a property is updated, allowing you to validate or transform the data before assigning it to a private field.

Data Protection

  • Using getters and setters helps safeguard the internal state of an object by providing a controlled interface for interaction;
  • Private properties can remain hidden, and you can expose only the necessary information to external code.

Flexibility

Getters and setters allow you to add additional logic—like validation or logging—when accessing or modifying properties without altering how external code interacts with the object.

Example: User Account with Password Validation

Imagine you are managing user accounts where passwords need to meet certain security standards. Using a setter, you can enforce password strength, while a getter could retrieve a masked version of the password for display purposes.


              
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 this example, the getter returns a masked version of the password to hide the actual value, and the setter enforces password validation, ensuring the password is at least 8 characters long.

Example with Validation Logic Using Getters and Setters

Here's another example where we manage a person's age and ensure that the value stays within a reasonable range:


              
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

This example demonstrates how a setter can ensure that an age remains within a valid range, preventing invalid data from being stored.

1. What is the primary purpose of using getters?

2. In the following code, what will console.log(user.password); output?

question mark

What is the primary purpose of using getters?

Select the correct answer

question mark

In the following code, what will console.log(user.password); output?

Select the correct answer

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 1. Розділ 9
some-alt