Bruno R

Clases en JavaScript

x
portfolio-next-l5vb64p5k-bandikyu.vercel.app

Vale la pena aclarar que las caracteristicas a analizar no son una nueva forma de combinar objetos, debajo del capo todavia usan prototipos. Mas bien son una forma de facilitar la configuracion de una cadena prototipica.

Clases y constructores

Esta seria la sintaxis para la creacion de una clase con su constructor, visto anteriormente en seudocodigo: 

	class Person {

  name;

  constructor(name) {
    this.name = name;
  }

  introduceSelf() {
    console.log(`Hi! I'm ${this.name}`);
  }

}
▸ Esto declara una clase llamada
▸ Con una propiedad
▸ Un constructor que toma un
▸ Y un metodo que puede dirijirse a las propiedades de los nuevos objetos con

El constructor se define mediante la palabra clave constructor y hara lo mismo que haria fuera de una clase:

▸ Crear un nuevo objeto
▸ Vincula this al nuevo objeto, para que pueda ser consultado desde el codigo del constructor
▸ ejecuta el codigo en el constructor, si es ok ⇒
▸ devuelve el nuevo objeto

Omitir constructores

Si no se requiere hacer ninguna inicializacion especial, se puede omitir, lo que generara una funcion constructora de forma predeterminada. Algo asi:

class Animal {

  sleep() {
    console.log('zzzzzzz');
  }

}

const spot = new Animal();

spot.sleep(); // 'zzzzzzz'

Herencia

Dada la clase anterior Person, generamos una subclase Professorque hereda la propiedad name de la superclase Person mediante la funcion constructora, la sintaxis seria la siguiente:

class Professor 
extends Person
 {

  teaches;

  constructor(name, teaches) {
    
super(name);

    this.teaches = teaches;
  }

  introduceSelf() {
    console.log(`My name is ${this.name}, and I will be your ${this.teaches} professor.`);
  }

  grade(paper) {
    const grade = Math.floor(Math.random() * (5 - 1) + 1);
    console.log(grade);
  }

}

Se utiliza la palabra clave extends para decir que esta clase heredara de otra.

Esta nueva clase tambien tendra propiedades nuevas, definidas en el constructor (teaches).

Lo que hace el constructor de esta clase es:

▸ Llamar al constructor de la super clase para que defina la
▸ Luego inicia la con la creacion de la segunda propiedad
▸ ambos son pasados como argumentos para el nuevo objeto a crear
▸ Tambien se anulo el metodo

Encapsulamiento

Luego para hacer que una propiedad o metodo se vuelva unico del scope de la clase y los objetos creados a partir de ella, se utiliza # antes de la declaracion de la propiedad o metodo:

class Student extends Person {


  #year;


  constructor(name, year) {
    super(name);

    this.#year = year;

  }


  introduceSelf() {
    console.log(`Hi! I'm ${this.name}, and I'm in year ${this.
#year
}.`);
  }

  canStudyArchery() {
    return this.
#year
 > 1;
  }

}

La unica forma de acceder a los datos privados es dentro del objeto, mediante metodos y propiedades, pero por fuera no se puede hacer llamadas a estas, hacerlo generaria error de sintaxis.

Metodos privados

basicamente lo mismo pero se coloca antes del metodo

class Example {

  somePublicMethod() {
    this.#somePrivateMethod();
  }

  #somePrivateMethod() {
    console.log('You called me?');
  }

}

const myExample = new Example();

myExample.somePublicMethod(); // 'You called me?'

myExample.#somePrivateMethod(); // SyntaxError

/*aca se esta mostrando de una manera ingeniosa
como llamando a una funcion privada genera error, pero llamando
a una funcion publica, que llama a una funcion privada es valido 
y retorna el valor de la funcion privada... algo asi como un puente*/

Bibliografia

Glosario de palabras

Buscar conceptos