Curso de programación con TypeScript
TypeScript, el superset de JavaScript que mejora la seguridad y la escalabilidad del código. Aprende a desarrollar con TypeScript hoy.
TypeScript es un lenguaje de programación de código abierto desarrollado por Microsoft que se basa en JavaScript. Añade tipado estático opcional y otras características avanzadas al lenguaje, lo que facilita el desarrollo de aplicaciones grandes y complejas. Al compilarse, TypeScript se convierte en JavaScript estándar, por lo que puede ejecutarse en cualquier entorno que soporte JavaScript.
¿Qué es TypeScript?
TypeScript es un superconjunto de JavaScript que incorpora tipos estáticos y herramientas de desarrollo más robustas. Permite detectar errores en tiempo de compilación, mejorar la legibilidad del código y facilitar el mantenimiento a largo plazo. Es especialmente útil en proyectos a gran escala donde la consistencia y la escalabilidad son fundamentales.
Ventajas de utilizar TypeScript
- Tipado estático: Ayuda a identificar errores antes de ejecutar el código.
- Mejor autocompletado: Los editores pueden proporcionar sugerencias más precisas.
- Interfaces y clases avanzadas: Facilitan la programación orientada a objetos.
- Compatibilidad con JavaScript: Todo código JavaScript válido es también válido en TypeScript.
Instalación de TypeScript
Para instalar TypeScript, necesitas tener Node.js y npm instalados. Luego, puedes instalar el compilador de TypeScript de manera global:
npm install -g typescript
Para verificar la instalación:
tsc --version
Configuración inicial
Archivo tsconfig.json
Este archivo configura el comportamiento del compilador de TypeScript. Puedes generarlo automáticamente con:
tsc --init
Ejemplo básico de tsconfig.json
:
{
"compilerOptions": {
"target": "es6",
"module": "commonjs",
"strict": true,
"outDir": "./dist"
},
"include": ["src/**/*"]
}
Sintaxis básica y tipos
Tipos primitivos
- string
- number
- boolean
- any
- void
- null y undefined
Declaración de variables
let mensaje: string = "Hola, TypeScript";
let numero: number = 42;
let esActivo: boolean = true;
Arreglos y tuplas
Arreglos
let listaNumeros: number[] = [1, 2, 3];
Tuplas
let par: [string, number] = ["edad", 30];
Enums
enum Color {
Rojo,
Verde,
Azul
}
let colorFavorito: Color = Color.Verde;
Funciones en TypeScript
Tipado de parámetros y retorno
function sumar(a: number, b: number): number {
return a + b;
}
Parámetros opcionales y por defecto
function construirNombre(nombre: string, apellido?: string): string {
return apellido ? `${nombre} ${apellido}` : nombre;
}
Funciones flecha
const multiplicar = (x: number, y: number): number => x * y;
Interfaces
Las interfaces definen contratos para clases y objetos.
interface Persona {
nombre: string;
edad: number;
saludar(): void;
}
let juan: Persona = {
nombre: "Juan",
edad: 25,
saludar() {
console.log(`Hola, me llamo ${this.nombre}`);
}
};
Clases y herencia
Clases
class Animal {
nombre: string;
constructor(nombre: string) {
this.nombre = nombre;
}
mover(distancia: number = 0) {
console.log(`${this.nombre} se movió ${distancia} metros.`);
}
}
Herencia
class Perro extends Animal {
ladrar() {
console.log("¡Guau!");
}
}
const miPerro = new Perro("Fido");
miPerro.ladrar();
miPerro.mover(10);
Modificadores de acceso
- public: Accesible desde cualquier lugar.
- private: Solo accesible dentro de la clase.
- protected: Accesible dentro de la clase y clases derivadas.
class Persona {
private dni: string;
public nombre: string;
constructor(nombre: string, dni: string) {
this.nombre = nombre;
this.dni = dni;
}
protected mostrarDNI() {
console.log(`Mi DNI es ${this.dni}`);
}
}
Generics (Genéricos)
Permiten crear componentes que funcionan con varios tipos.
function identidad<T>(arg: T): T {
return arg;
}
let salida = identidad<string>("Hola");
Módulos y espacios de nombres
Módulos
Los módulos ayudan a organizar el código y a reutilizarlo.
// en archivo matematicas.ts
export function sumar(a: number, b: number): number {
return a + b;
}
// en archivo principal.ts
import { sumar } from './matematicas';
console.log(sumar(2, 3));
Espacios de nombres
Agrupan código bajo un mismo identificador.
namespace Geometria {
export namespace Areas {
export function cuadrado(lado: number): number {
return lado * lado;
}
}
}
let area = Geometria.Areas.cuadrado(5);
Tipos avanzados
Union Types
Permiten que una variable tenga más de un tipo.
let identificador: number | string;
identificador = 10;
identificador = "ABC123";
Type Aliases
Definen nombres personalizados para tipos.
type ID = number | string;
let usuarioID: ID = 123;
Compilación y herramientas
Compilación manual
tsc archivo.ts
Compilación automática
Usando el modo watch:
tsc archivo.ts -w
Integración con bundlers
TypeScript se integra bien con herramientas como Webpack o Parcel para la construcción de aplicaciones.
Integración con librerías JavaScript
Para utilizar librerías escritas en JavaScript, es posible instalar sus definiciones de tipos.
npm install @types/lodash
Luego, puedes importarlas con seguridad de tipos:
import * as _ from 'lodash';
_.chunk(['a', 'b', 'c', 'd'], 2);
Configuración avanzada
Strict Mode
Activar el modo estricto en tsconfig.json
ayuda a detectar más errores.
{
"compilerOptions": {
"strict": true
}
}
Decoradores
Característica experimental que permite añadir metadatos a clases y miembros.
function log(constructor: Function) {
console.log(`Clase creada: ${constructor.name}`);
}
@log
class MiClase {
// ...
}
Buenas prácticas
- Usar tipado estricto: Evita errores y mejora la legibilidad.
- Evitar
any
cuando sea posible: Utilizar tipos específicos. - Organizar el código en módulos: Facilita el mantenimiento.
- Documentar el código: Ayuda a otros desarrolladores a entender la intención.
- Mantener actualizadas las dependencias: Evita problemas de compatibilidad.
Recursos adicionales
- Sitio oficial de TypeScript: typescriptlang.org
Tutoriales de TypeScript
Aprende TypeScript con tutoriales de programación en TypeScript.
Ejercicios de programación de TypeScript
Evalúa tus conocimientos en TypeScript con ejercicios de programación TypeScript de tipo Test, Puzzle, Código y Proyecto con VSCode.
Tipo de tecnología
Lenguaje
Categoría laboral
Full Stack
Año de lanzamiento
2012
Developers
Microsoft
Todos los módulos del curso de TypeScript
TypeScript
Introducción y entorno
TypeScript
Sintaxis
TypeScript
Programación Orientada a Objetos
TypeScript
Programación Funcional
TypeScript
Tipos intermedios y avanzados
TypeScript
Namespaces y Módulos
TypeScript
Testing
Otras tecnologías
OpenAI
OpenAI
IA Generativa
Laboratorio de IA Generativa, creador de ChatGPT y modelos GPT.
C
C
Backend
Lenguaje de propósito general, eficiente y de bajo nivel.
Rust
Rust
Backend
Lenguaje de programación de sistemas enfocado en seguridad, concurrencia y rendimiento.
R
R
Ciencia de Datos e IA
Lenguaje para análisis estadístico, manipulación de datos y visualización gráfica.
Go
Go
Backend
Lenguaje de programación eficiente y concurrente creado por Google.
Hibernate
Hibernate
Backend
ORM para Java, simplifica el acceso a bases de datos.