Clases e Interfaces

Javascript a partir de ECMAScript2015 introdujo clases al lenguaje. Sin embargo, es importante tener en cuenta que estas clases no cambian la herencia basada en prototipos del lenguaje. Typescript permite definir clases antes de que sean transpiladas a javascript ES6. Por lo tanto, los desarrolladores pueden extender clases para construir nuevas clases usando herencia.

Para este ejemplo instanciaremos una universidad empezando por la clases Student que hereda de la clase Person.

class Person {
  name: string;
  code: number;
  cardId: number;
  constructor(completeName: string,code: number, cardId: number) {
    this.name = completeName;
    this.code = code;
    this.cardId = cardId;
  }
}

class Student extends Person {
  age: number;
  address: string;
  phone:string;
  currentCourses: Course[];
  constructor(completeName: string,code: number, cardId: number, age:number,address:string,phone:string) {
    super(completeName,code,cardId);
    this.age = age;
    this.address = address;
    this.phone = phone;
  }
}

Como se puede observar la sintaxis es similar a Java o C#. En las dos clases anteriores hemos definido atributos, con su respectivo tipo de datos, y el constructor de la clase. Note que en el constructor de la clase estamos usando this para hacer referencia al objeto actual.

Observe que la clase Student declara el atributo currentCourses de tipo array de Course definida como sigue:

class Course {
  name: string;
  credits: number;
  teacher: Teacher;
  
  constructor(name: string,credits:number, teacher:Teacher ) {
    this.name = name;
    this.credits = credits;
    this.teacher = teacher;
  }
}

Ver en StackBlitz

Construcción de objetos

En el proyecto aparecen dos archivos ( y dataStudent y dataCourses). El archivo dataStudent contiene los datos de una estudiante y dataCourses contiene un arreglo con sus cursos. Para incializar algunos objetos de nuestras clases y hacer más ejemplos, vamos a construir una función para leer los datos del un arreglo de objetos de tipo Course y asociarlos con la estudiante.

En el index.ts tenemos el siguiente código:

var student: Student = dataStudent;

function cargarDatos() {
  dataCourses.map(function (course) {
    student.currentCourses.push(course);
  });
}

cargarDatos();
console.log(student);

Recordemos que la función map se ejecuta sobre un arreglo (map). En este caso sobre el arreglo que contiene la lista de cursos dataCourses. La función map ejecuta sobre cada elemento del arreglo la función que va de parámetro:

function (course) {
    student.currentCourses.push(course);
  }

La función recibe el curso y lo que hace es agregarlo al atributo currentCourses de la estudiante. Esto funciona ya que javascript automáticamente hace el equivalente a un Cast en java cuando se asigna la constante dataStudent a una variable de tipo Student e igualmente con los cursos.

Ver en StackBlitz

Interfaces

Las interfaces en javascript, como en Java, son colecciones de signaturas de métodos y atributos que especifican qué se debe hacer pero no su implementación. Dado que javascript es un lenguaje dinámico, es muy poca la utilidad de interfaces en el momento de programar. Sn embargo, el tipado estático de Typescript las hace de toda utilidad porque va a forzar la verificación de tipos: las decisiones tomadas en la interfaz se deben cumplir. Sigamos con el ejemplo y veamos la definición de la interfaz Teacher:

interface Teacher extends Person {
  numOffice: string;
  [propName: string]: any;
}

El atributo [propName: string]: any permite que un objeto Teacher tenga múltiples atributos, de tipo string, cuyo nombre puede variar en la interfaz . Para este ejemplo se les definió un atributo University en el archivo de la información dummy de los cursos.

De esta manera cuando el index.ts imprime la información del estudiante, sus cursos y los respectivos profesores, los objetos Teacher contienen el atributo University definido. Si bien esta facilidad es interesante, no es recomendada, dado que lo que queremos es evitar introducir errores y el que el compilador revise los tipos es una gran ayuda.

Pregunta: Que pasa si se le intenta asignar un atributo de tipo numero a uno de los profesores desde el archivo de carga?

Ver en StackBlitz