jueves, 8 de diciembre de 2016

Angular 2. Entrega 2. Un poco de Typerscript

1. Características generales de Typescript


Se aconseja trabajar con Typescript que es un javascript tipado que nos ayuda a disminuir los errores inesperados de ejecucion. ya que permite:
1. Inferencia de tipos
2. Tipos opcionales
3. Orientación a objetos y clases
4. Anotaciones (decorators)

2. Clases en Typescript


1. Una clase pública se indica con export class NombreClase
2. Un constructor se define como constructor( parametros)
3. Los atributos de clase ( y también los métodos) son publicos y se aconseja declarar su tipo, en caso que fueran privados se indicaría public atributo1: string
4. Los métodos no hace falta declarar el tipo ya que se infieren por el tipo de variable que devuelven.
5. Cuando se referencia a un atributo dentro de la clase, hay que hacerlo con this.atributo.
6. Lo normal es guardar cada clase en su propio fichero, en este caso Persona.ts
7. Si queremos usar esa clase, habrá que importarla tal y como hacíamos en Java, pero declarando dicha importación incluso si estamos en el mismo paquete o carpeta.
8. Cuando asignamos objetos se utiliza let (let objeto1=objeto2)


public class Persona {
  private nombre: string;
  private edad: number;

  constructor ( nombre:string, edad:number) {
    this.nombre=nombre;
    this.edad=edad;
  }

  getedad() {
    return this.edad;
  }

  tostring() {
    return "Persona con nombre=" + this.nombre;
 }
}

9. Mediante el constructor podemos obviar la declaración de atributos, quedando la clase anterior:

public class Persona {
  
  constructor ( private nombre:string, private edad:number) {
  }

  getedad() {
    return this.edad;
  }

  tostring() {
    return "Persona con nombre=" + this.nombre;
 }
}


Ahora si hacemos referencia a ella desde otro fichero en el mismo directorio:

import { Persona } from "./Persona"

personas = new Array<Persona>();

3. Arrays, blucles,  arrow functions e interfaces en Typescript


1. Antes hemos visto como declar un array
2. Para añadir un elemento se utiliza push  ej. personas.push(new persona( 'Ximo', 30));
3. Hay bucles for ej. for (let pers of personas) {console.log (pers.getedad())};
4. En las lambdas (arrow functions)se utiliza el operador => (no confundir con el de java ->)
5. Las lambdas pueden acceder y modificar variables fuera de ellas (en java estasd variables son finales)
6. Desaparece el patrón this that de javascript en un lambda, y ahora solo se utiliza this

import { Persona } from "./Persona"

personas = new Array<Persona>();

personas.push (new Persona('Ximo',30));
personas.push (new Persona('Tatiana',54));

for ( let pers of personas) {
  console.log(pers.getedad());
}

personas.forEach(pers => {
  console.log(pers.getedad());
});

7. Podemos crear interfaces, para tipificar variable. 
8. Mediante ? indicamos que el atributo es opcional

interface DatosOpcionales{
  altura: number;
  peso?: number;
}
let otros: DatosOpcionales;
otros = {altura: 1.70};
otros = {altura : 1.76, peso:80);

9. Una variable declarada de un tipo puede asignarse a otro tipo de variable siempre que los atributos (y métodos) sean iguales (que tengan la misma estructura también llamada contrato).

interface Persona {
  nombre: string;
}

class Trabador {
  constructor (public nombre: string){};
}

let yo: Persona;
yo = { nombre: 'Timoteo'};
yo = new Trabajador('Ximo');

9. La sobrecarga de métodos es un poco especial, permitiendo tener parametros opcionales. Se pueden tener varias declaraciones de métodos. pero una sola implementaciòn.

4. Anotaciones (decorators) , promesa en Typescript


1. Para usar una anotación hay que importarla previamente.
2. Una anotación puede tener parejo un comportamiento.
3. Por ejemplo la anotación @Component de angular, es como una función que hay que meterle paréntesis,

4. De momento no podemos utilizar el patrón async/await ya que solo esta en ES6. Tenemos que utilizar promesas
5. variables tipo union "|"(ej. let var1; number | string)
6. Utilizaremos el operador typeof para saber el tipo de la variable en ese momento, y no hace falta hacer un "cast".


No hay comentarios :

Publicar un comentario