¿Cuál es la visibilidad predeterminada para las propiedades/métodos en las clases de Typescript?

En Typescript , por defecto, la visibilidad de todas las propiedades o métodos en las clases de Typescript es “ pública ”. Un método con el que es público se puede acceder desde cualquier lugar, no tiene restricciones. Hay tres tipos de visibilidades de miembros: pública , privada y protegida.

Ejemplo 1: Clase con visibilidad de miembro público

Se puede acceder a las funciones y propiedades públicas desde cualquier lugar. Por defecto, todos los métodos y propiedades son ‘ públicos ‘. En este ejemplo, creamos una clase estudiante que tiene dos propiedades y un método. Usamos la palabra clave public para representar que la función tiene visibilidad pública, pero por defecto todas las propiedades y métodos son públicos y no necesitamos especificar eso. 

Javascript

class Student {
  name: string;
  id: number;
  constructor(name: string, id: number) {
    this.name = name;
    this.id = id;
  }
  public student_details() {
    console.log(
      "my name is : " +
        this.name +
        " my roll no is : " +
        `${this.id.toString()}`
    );
  }
}
  
let obj = new Student("rahul", 367236);
obj.student_details();

Salida: se crea un obj y se llama al método student_details().

my name is : rahul my roll no is : 367236

Ejemplo 2: clase con visibilidad de miembros protegidos

Los miembros o propiedades que tienen visibilidad «protegida» son accesibles solo en su clase o sus subclases. En este ejemplo, la palabra clave protected se usa al declarar la función y antes de la propiedad ‘nombre’. La clase classRepresentative se deriva de la clase Student. cuando intentamos acceder a «nombre» desde fuera, devuelve un error ya que podemos usarlo y acceder solo en esa clase o sus subclases. El nombre también se usa en la función student_name() pero el error no se genera ya que está dentro de la clase. Como student_details() está protegido, no se puede acceder a él desde el exterior. 

Javascript

class Student {
  protected name: string;
  id: number;
  constructor(name: string, id: number) {
    this.name = name;
    this.id = id;
  }
  protected student_details() {
    console.log(
      "my name is : " +
        this.name +
        " my roll no is : " +
        `${this.id.toString()}`
    );
  }
  student_name() {
    console.log("My name is : " + self.name);
  }
}
  
class classRepresentative extends Student {
  detail() {
    console.log("I am the class representative, my name is :" 
      + this.name);
  }
}
  
let obj = new Student("rahul", 367236);
let obj1 = new classRepresentative("samuel", 287636);
  
obj.name; // Error as name is protected
obj.student_name(); // No error
obj.student_details(); // Error
obj1.detail(); // No error
obj1.student_details(); //Error

Producción:

error TS2445: Property 'name' is protected and only accessible within 
class 'Student' and its subclasses.
    obj.name; // error as name is protected
        ~~~~

two.ts:131:5 - error TS2445: Property 'student_details' is protected and only accessible 
within class 'Student' and its subclasses.
    obj.student_details(); //error
        ~~~~~~~~~~~~~~~

two.ts:133:6 - error TS2445: Property 'student_details' is protected and only accessible 
within class 'Student' and its subclasses.
    obj1.student_details(); //error
         ~~~~~~~~~~~~~~~

Ejemplo 3: Clase con visibilidad de miembro privado

Private es similar a protected, pero también evita que las subclases accedan al miembro. Una clase derivada no puede mejorar su visibilidad porque los miembros privados no son visibles para las clases derivadas. En el ejemplo anterior, la clase derivada usa la propiedad this.name en la función detail() y no se genera ningún error ya que la propiedad se puede usar en las subclases, pero cuando su visibilidad se establece en privado, no se puede acceder a ella en las subclases o clases derivadas nunca más. 

Javascript

class Student {
  private name: string;
  id: number;
  constructor(name: string, id: number) {
    this.name = name;
    this.id = id;
  }
  private student_details() {
    console.log(
      "my name is : " +
        this.name +
        " my roll no is : " +
        `${this.id.toString()}`
    );
  }
  student_name() {
    console.log("My name is : " + self.name);
  }
}
class classRepresentative extends Student {
  detail() {
    console.log("I am the class representative, my name is :"
      + this.name);
  }
    
}
  
let obj = new Student("rahul", 367236);
let obj1 = new classRepresentative("samuel", 287636);
  
obj.name; // Error as name is private
obj.student_name(); // No error
obj.student_details(); // Error
obj1.detail(); // No error
obj1.student_details(); // Error

Producción:

error TS2341: Property 'name' is private and only accessible within class 'Student'.
        console.log("I am the class representative, my name is :" + this.name);
                                                                         ~~~~
                                                                         
two.ts:161:5 - error TS2341: Property 'name' is private and only accessible
 within class 'Student'.
    obj.name; // error as name is protected
        ~~~~

two.ts:163:5 - error TS2341: Property 'student_details' is private and only accessible 
within class 'Student'.
    obj.student_details(); //error
        ~~~~~~~~~~~~~~~

two.ts:165:6 - error TS2341: Property 'student_details' is private and only accessible 
within class 'Student'.
    obj1.student_details(); //error
         ~~~~~~~~~~~~~~~

Referencia: https://www.typescriptlang.org/docs/handbook/classes.html#public-private-and-protected-modifiers

Publicación traducida automáticamente

Artículo escrito por isitapol2002 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *