Saltar al contenido principal
Curso/Interfaces y Clases/Clases en TypeScript
Volver a Interfaces y Clases

Interfaces y Clases — Leccion 3

·20 min

Clases en TypeScript

Definición, constructores, métodos y propiedades.

Definición básica

typescript
class Persona {
  nombre: string;
  edad: number;

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

  presentarse(): string {
    return `Hola, soy ${nombre} y tengo ${edad} años`;
  }
}

const ana = new Persona("Ana", 25);
ana.presentarse(); // "Hola, soy Ana y tengo 25 años"

Shorthand de constructor

TypeScript permite declarar propiedades directamente en el constructor.

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

// Equivale a declarar las propiedades + asignar en constructor

Métodos

typescript
class Calculadora {
  resultado: number = 0;

  sumar(n: number): Calculadora {
    this.resultado += n;
    return this; // Para chaining
  }

  restar(n: number): Calculadora {
    this.resultado -= n;
    return this;
  }

  obtener(): number {
    return this.resultado;
  }
}

const calc = new Calculadora();
calc.sumar(5).sumar(3).restar(2);
calc.obtener(); // 6

Propiedades estáticas y métodos

typescript
class Contador {
  static total: number = 0;

  constructor(public nombre: string) {
    Contador.total++;
  }

  static getTotal(): number {
    return Contador.total;
  }
}

new Contador("A");
new Contador("B");
Contador.getTotal(); // 2

Getters y Setters

typescript
class Temperatura {
  private _celsius: number;

  constructor(celsius: number) {
    this._celsius = celsius;
  }

  get fahrenheit(): number {
    return this._celsius * 9/5 + 32;
  }

  set celsius(valor: number) {
    if (valor < -273.15) throw new Error("Temperatura invalida");
    this._celsius = valor;
  }
}

const temp = new Temperatura(100);
temp.fahrenheit; // 212
temp.celsius = 0;

Ejercicio pratico

Crea una clase 'Cuenta' con titular, saldo, y métodos depositar y extraer.

exercise.ts
Loading...
Resultado

Haz clic en "Ejecutar" para ver el resultado...

Curso de TypeScript — Aprende desde cero