Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Aprende Gestión de Propiedades con Getters y Setters | Dominio de las Clases e Herencia en JavaScript
Maestría Avanzada en JavaScript

bookGestión de Propiedades con Getters y Setters

Los getters y setters ofrecen una forma potente de controlar el acceso a las propiedades de un objeto en JavaScript.

¿Qué son los Getters y Setters?

En JavaScript, los getters y setters son métodos especiales que permiten un acceso controlado a las propiedades de un objeto. Proporcionan flexibilidad para definir cómo se recupera y modifica una propiedad, protegiendo al mismo tiempo el estado interno del objeto.

  • Getter: Método utilizado para recuperar (obtener) el valor de una propiedad;
  • Setter: Método utilizado para establecer o actualizar el valor de una propiedad.

Piense en una bóveda bancaria. La bóveda contiene objetos valiosos (propiedades privadas), y el cajero del banco (getter/setter) actúa como el guardián. No se puede acceder directamente a la bóveda, pero el cajero puede recuperar o actualizar los objetos por usted según ciertas reglas y validaciones.

Cómo definir y utilizar Getters y Setters

Los getters y setters se definen utilizando las palabras clave get y set dentro de una clase. Cuando se accede a una propiedad, el getter se invoca automáticamente. De manera similar, cuando se modifica una propiedad, se llama al setter en lugar de modificar la propiedad directamente.


              
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

En este ejemplo, #type es una propiedad privada, y se define un getter (get type()) para recuperar su valor y un setter (set type(newType)) para modificarlo. El setter incluye validación para evitar asignar un valor no válido, demostrando cómo se puede controlar la actualización de datos privados.

Beneficios de los getters y setters

Acceso controlado

  • Los getters permiten definir cómo se accede al valor de una propiedad, posibilitando procesar o manipular el valor antes de devolverlo;
  • Los setters otorgan control sobre cómo se actualiza una propiedad, permitiendo validar o transformar los datos antes de asignarlos a un campo privado.

Protección de datos

  • El uso de getters y setters ayuda a proteger el estado interno de un objeto al proporcionar una interfaz controlada para la interacción;
  • Las propiedades privadas pueden permanecer ocultas, y solo se expone la información necesaria al código externo.

Flexibilidad

Los getters y setters permiten agregar lógica adicional—como validación o registro—al acceder o modificar propiedades sin alterar la forma en que el código externo interactúa con el objeto.

Ejemplo: Cuenta de usuario con validación de contraseña

Suponga que está gestionando cuentas de usuario donde las contraseñas deben cumplir ciertos estándares de seguridad. Mediante un setter, puede hacer cumplir la fortaleza de la contraseña, mientras que un getter podría recuperar una versión enmascarada de la contraseña para fines de visualización.


              
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

En este ejemplo, el getter devuelve una versión enmascarada de la contraseña para ocultar el valor real, y el setter aplica la validación de la contraseña, asegurando que tenga al menos 8 caracteres.

Ejemplo con lógica de validación usando getters y setters

A continuación, se muestra otro ejemplo donde se gestiona la edad de una persona y se garantiza que el valor permanezca dentro de un rango razonable:


              
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

Este ejemplo demuestra cómo un setter puede asegurar que una edad permanezca dentro de un rango válido, evitando que se almacenen datos no válidos.

1. ¿Cuál es el propósito principal de utilizar getters?

2. En el siguiente código, ¿qué mostrará console.log(user.password);?

question mark

¿Cuál es el propósito principal de utilizar getters?

Select the correct answer

question mark

En el siguiente código, ¿qué mostrará console.log(user.password);?

Select the correct answer

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 1. Capítulo 9

Pregunte a AI

expand

Pregunte a AI

ChatGPT

Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla

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

bookGestión de Propiedades con Getters y Setters

Desliza para mostrar el menú

Los getters y setters ofrecen una forma potente de controlar el acceso a las propiedades de un objeto en JavaScript.

¿Qué son los Getters y Setters?

En JavaScript, los getters y setters son métodos especiales que permiten un acceso controlado a las propiedades de un objeto. Proporcionan flexibilidad para definir cómo se recupera y modifica una propiedad, protegiendo al mismo tiempo el estado interno del objeto.

  • Getter: Método utilizado para recuperar (obtener) el valor de una propiedad;
  • Setter: Método utilizado para establecer o actualizar el valor de una propiedad.

Piense en una bóveda bancaria. La bóveda contiene objetos valiosos (propiedades privadas), y el cajero del banco (getter/setter) actúa como el guardián. No se puede acceder directamente a la bóveda, pero el cajero puede recuperar o actualizar los objetos por usted según ciertas reglas y validaciones.

Cómo definir y utilizar Getters y Setters

Los getters y setters se definen utilizando las palabras clave get y set dentro de una clase. Cuando se accede a una propiedad, el getter se invoca automáticamente. De manera similar, cuando se modifica una propiedad, se llama al setter en lugar de modificar la propiedad directamente.


              
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

En este ejemplo, #type es una propiedad privada, y se define un getter (get type()) para recuperar su valor y un setter (set type(newType)) para modificarlo. El setter incluye validación para evitar asignar un valor no válido, demostrando cómo se puede controlar la actualización de datos privados.

Beneficios de los getters y setters

Acceso controlado

  • Los getters permiten definir cómo se accede al valor de una propiedad, posibilitando procesar o manipular el valor antes de devolverlo;
  • Los setters otorgan control sobre cómo se actualiza una propiedad, permitiendo validar o transformar los datos antes de asignarlos a un campo privado.

Protección de datos

  • El uso de getters y setters ayuda a proteger el estado interno de un objeto al proporcionar una interfaz controlada para la interacción;
  • Las propiedades privadas pueden permanecer ocultas, y solo se expone la información necesaria al código externo.

Flexibilidad

Los getters y setters permiten agregar lógica adicional—como validación o registro—al acceder o modificar propiedades sin alterar la forma en que el código externo interactúa con el objeto.

Ejemplo: Cuenta de usuario con validación de contraseña

Suponga que está gestionando cuentas de usuario donde las contraseñas deben cumplir ciertos estándares de seguridad. Mediante un setter, puede hacer cumplir la fortaleza de la contraseña, mientras que un getter podría recuperar una versión enmascarada de la contraseña para fines de visualización.


              
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

En este ejemplo, el getter devuelve una versión enmascarada de la contraseña para ocultar el valor real, y el setter aplica la validación de la contraseña, asegurando que tenga al menos 8 caracteres.

Ejemplo con lógica de validación usando getters y setters

A continuación, se muestra otro ejemplo donde se gestiona la edad de una persona y se garantiza que el valor permanezca dentro de un rango razonable:


              
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

Este ejemplo demuestra cómo un setter puede asegurar que una edad permanezca dentro de un rango válido, evitando que se almacenen datos no válidos.

1. ¿Cuál es el propósito principal de utilizar getters?

2. En el siguiente código, ¿qué mostrará console.log(user.password);?

question mark

¿Cuál es el propósito principal de utilizar getters?

Select the correct answer

question mark

En el siguiente código, ¿qué mostrará console.log(user.password);?

Select the correct answer

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 1. Capítulo 9
some-alt