TypeScript | Javascript – 2nd Edition #4

En esta cuarta parte tocaremos interfases, classes y funciones.No solo veremos la teoria sino también algunos ejemplos en VS Code.

Clases

Comenzaremos por las Clases. En JavaScript siempre utilizamos funciones y el patrón prototipo para hacer uso de clases y  herencia. Si están familiarizados con C# o Java tal vez nos resulte bastante incómodo en Javascript. Por esto, TypeScript, nos da la posibilidad de usarlas del modo como cualquier lenguaje orientado a objetos. También nos brindara compatibilidad futuras implementaciones de las especificaciones ECMAScript. Veamos:

class Persona {
	nombre: string;
	constructor(_nombre: string) {
    	    this.nombre = _nombre;
	}
	greet() {
    	     return "Hello, " + this.nombre;
	}
}

let fernando = new Persona("Fernando");

Como comente antes, es bastante más familiar que como lo usamos en JavaScript.  Algunos puntos para tener en cuenta: 

• this hace referencia a la misma clase.
• El constructor, a diferencia de los lenguajes que ya conocemos siempre debe llamarse constructor.
• En las funciones no es necesario agregar la palabra function.

Como cualquier lenguaje de programación orientado a objetos tenemos herencia. Esto lo haremos por medio de la palabra reservada extends como vemos en el ejemplo:

class Estudiante extends Persona{
	constructor(nombre: string) {
        	super(name);
	}
	greet() {
         	return super.greet();
	}
}

En el ejemplo podemos ver la palabra super que hace referencia a la clase de la cual heredamos. 

Modificadores

TypeScript no da 3 tipos de modificadores de acceso, públicos, privados y protegidos.

Público

Por defecto serán declarados como públicos, esto hará que podamos acceder desde cualquier lugar del programa. Podemos marcarlo implícitamente si lo queremos, pero no es necesario.

class Persona {
	public name: string;
	public constructor(theName: string) { this.name = theName;}
}

Private

Cuanto lo declaramos como private el método no podrá ser accesible desde fuera de la clase.

class Persona {
	private name: string;
	public constructor(theName: string) { this.name = theName;} }

Protected

Funciona como private,  pero a diferencia de este pueden ser accedidas solamente por las clases derivadas.

class Persona {
	protected name: string;
	public constructor(theName: string) { this.name = theName;} }

ReadOnly

Podemos declarar solo lectura, esto hará que no pueda asignarle ningún valor desde fuera de la clase y la asignación debe hacerse en el constructor.

class Persona {
	readonly name: string;
	public constructor(name: string) { this.name = name;} 
}

let persona = new Persona("Fernando");
persona.name;

Accessors

En TypeScript tenemos la posibilidad de usar getters y setters.

class Persona {
     private name: string;
     
     get Name():string{
          return this.name;
     }
     
     set Name(_name: string){
          this.name = name;
     }     
}

Tener setters nos da la posibilidad de poder evaluar la asignación de un valor por medio de una comparación.

Propiedades Estáticas

Podremos crear un miembro estático que serán visibles sin la necesidad de instanciar la clase.

class Calculadora {
	static result: number = 0;    
}

Calculadora.result;

Clases abstractas

Estas clases no pueden instanciarse directamente. Deben ser heredadas obligatoriamente. A diferencia de una interface puede implementar funcionalidades en sus miembros.

abstract class Persona {
	abstract getName(): void;
}

class Estudiante extends Persona {

	getName(): void {}
}

Interfaces

Son una forma de declarar contratos dentro del código para las clases que tienen características comunes. Veamos la siguiente clase:

class Persona {
	public name: string;
	public constructor(theName: string) { this.name = theName;}
}

Supongamos que vamos a tener 2 clases: estudiantes y profesores. Todos deben cumplir la regla de tener una propiedad name. Para esto usaremos una interface que obligará a que sea implementada:

interface Persona {
	name: string;	
}

class Estudiante implements Persona{
     public name: string;
}

class Profesor implements Persona{
     public name: string;
}

Propiedades opcionales

Una buena caracteristicas es que podemos declarar variables opciones las cuales no obligan a las clases que implementar a declarar esos miembros. Se hace por medio del carácter «?».

interface Persona {
	name?: string;	
}

Propiedades solo lectura

podemos especificar que los miembros deben ser declarados como readonly.

interface Persona {
	readonly name: string;	
}

Conclusión

Hemos las clases, interfaces y funciones. Si bien el tema puede ser mucho más extenso, con este pantallazo general nos dan la base para poder seguir expandiendo nuestros conocimientos. El el próximo post veremos el tema de Tipos Genéricos.