En este tema, aprenderemos sobre las variables y los tipos de datos en TypeScript. TypeScript es un superconjunto de JavaScript que añade tipado estático, lo que nos permite definir tipos de datos para nuestras variables y funciones, mejorando así la robustez y mantenibilidad del código.
- Declaración de Variables
En TypeScript, podemos declarar variables utilizando let, const y var. Sin embargo, se recomienda usar let y const debido a su alcance de bloque y características de inmutabilidad.
let y const
- let: Permite declarar variables que pueden ser reasignadas.
- const: Permite declarar variables cuyo valor no puede ser reasignado.
Ejemplo:
let nombre: string = "Juan"; const edad: number = 30; nombre = "Pedro"; // Válido // edad = 31; // Error: No se puede reasignar una variable const
- Tipos de Datos Básicos
TypeScript soporta varios tipos de datos básicos, incluyendo:
- number: Para números, tanto enteros como de punto flotante.
- string: Para cadenas de texto.
- boolean: Para valores booleanos (true/false).
- any: Para valores de cualquier tipo.
- void: Para funciones que no retornan un valor.
- nully- undefined: Para valores nulos y no definidos.
- array: Para listas de valores.
- tuple: Para listas de valores con tipos específicos.
- enum: Para definir un conjunto de constantes con nombre.
Ejemplo:
let numero: number = 42;
let texto: string = "Hola, TypeScript";
let esVerdadero: boolean = true;
let cualquierCosa: any = "Puede ser cualquier cosa";
let sinValor: void = undefined;
let nulo: null = null;
let indefinido: undefined = undefined;
let lista: number[] = [1, 2, 3];
let tupla: [string, number] = ["Hola", 42];
enum Color {
    Rojo,
    Verde,
    Azul
}
let colorFavorito: Color = Color.Verde;
- Inferencia de Tipos
TypeScript puede inferir el tipo de una variable basado en el valor inicial asignado. Esto significa que no siempre es necesario especificar el tipo explícitamente.
Ejemplo:
let mensaje = "Hola, Mundo"; // TypeScript infiere que 'mensaje' es de tipo 'string' let numeroInferido = 100; // TypeScript infiere que 'numeroInferido' es de tipo 'number'
- Tipos Personalizados
TypeScript permite definir tipos personalizados utilizando type y interface.
type
type se utiliza para definir alias de tipos.
Ejemplo:
interface
interface se utiliza para definir la estructura de un objeto.
Ejemplo:
interface Persona {
    nombre: string;
    edad: number;
}
let persona: Persona = {
    nombre: "Juan",
    edad: 30
};Ejercicios Prácticos
Ejercicio 1: Declaración de Variables
Declara una variable nombre de tipo string y asígnale tu nombre. Luego, declara una variable edad de tipo number y asígnale tu edad.
Ejercicio 2: Tipos de Datos
Declara una variable esEstudiante de tipo boolean y asígnale true. Luego, declara una variable calificaciones de tipo array de números y asígnale una lista de calificaciones.
Ejercicio 3: Tipos Personalizados
Define un tipo personalizado Direccion que tenga las propiedades calle (string) y ciudad (string). Luego, declara una variable miDireccion de tipo Direccion y asígnale un valor.
type Direccion = {
    calle: string;
    ciudad: string;
};
let miDireccion: Direccion = {
    calle: "Calle Falsa 123",
    ciudad: "Springfield"
};Soluciones
Solución Ejercicio 1
Solución Ejercicio 2
Solución Ejercicio 3
type Direccion = {
    calle: string;
    ciudad: string;
};
let miDireccion: Direccion = {
    calle: "Calle Falsa 123",
    ciudad: "Springfield"
};Conclusión
En esta sección, hemos aprendido sobre la declaración de variables y los tipos de datos en TypeScript. Hemos visto cómo usar let y const, los tipos de datos básicos, la inferencia de tipos y cómo definir tipos personalizados. Estos conceptos son fundamentales para escribir código TypeScript robusto y mantenible. En la próxima sección, exploraremos las funciones y las funciones flecha en TypeScript.
Curso de Angular 2+
Módulo 1: Introducción a Angular
- ¿Qué es Angular?
- Configuración del Entorno de Desarrollo
- Tu Primera Aplicación Angular
- Arquitectura de Angular
Módulo 2: Conceptos Básicos de TypeScript
- Introducción a TypeScript
- Variables y Tipos de Datos en TypeScript
- Funciones y Funciones Flecha
- Clases e Interfaces
Módulo 3: Componentes y Plantillas
- Creación de Componentes
- Plantillas de Componentes
- Estilos de Componentes
- Interacción entre Componentes
Módulo 4: Directivas y Pipes
Módulo 5: Servicios e Inyección de Dependencias
- Introducción a los Servicios
- Creación y Uso de Servicios
- Inyección de Dependencias
- Inyectores Jerárquicos
Módulo 6: Enrutamiento y Navegación
Módulo 7: Formularios en Angular
- Formularios Basados en Plantillas
- Formularios Reactivos
- Validación de Formularios
- Formularios Dinámicos
Módulo 8: Cliente HTTP y Observables
- Introducción al Cliente HTTP
- Realizando Solicitudes HTTP
- Manejo de Respuestas HTTP
- Uso de Observables
Módulo 9: Gestión de Estado
- Introducción a la Gestión de Estado
- Uso de Servicios para la Gestión de Estado
- NgRx Store
- NgRx Effects
