certmundo.
es‑mx

6 min de lectura

¿Qué son los tipos básicos en TypeScript?

Los tipos básicos en TypeScript son anotaciones que le dicen al compilador qué clase de dato puede guardar una variable.

Con ellos, el compilador detecta errores antes de que ejecutes tu código. Esto evita fallos en producción que son difíciles de rastrear.

Los cuatro tipos fundamentales

TypeScript incluye varios tipos primitivos. Los más usados en proyectos reales son cuatro: string, number, boolean y array.

Tipo Descripción Ejemplo de valor
string Texto "Liverpool"
number Número entero o decimal 18500
boolean Verdadero o falso true
array Lista de valores [1, 2, 3]
any Cualquier tipo (evítalo) "hola", 42, true
void Sin valor de retorno Funciones sin return

Cada tipo tiene un propósito claro. Mezclarlos sin control genera bugs silenciosos.

Sintaxis para declarar tipos

La forma general es:

nombreVariable: Tipo = valor;

El : Tipo se llama anotación de tipo. Va entre el nombre de la variable y el signo =.

let empresa: string = "Bimbo";
let salario: number = 18500;
let activo: boolean = true;
let productos: string[] = ["Pan Blanco", "Gansito", "Marinela"];

Eso es todo. La sintaxis no es complicada.

Ejemplos prácticos

Ejemplo 1 — Variables simples

Imagina que trabajas en el área de recursos humanos de FEMSA. Necesitas guardar datos de un empleado.

let nombreEmpleado: string = "Carlos Mendoza";
let puesto: string = "Analista de Logística";
let salarioMensual: number = 22000;
let esDePlanta: boolean = true;

console.log(nombreEmpleado);   // Carlos Mendoza
console.log(salarioMensual);   // 22000
console.log(esDePlanta);       // true

Si intentas asignar un número donde se espera texto, TypeScript te detiene:

nombreEmpleado = 99; // ❌ Error: Type 'number' is not assignable to type 'string'

Ese error aparece en tu editor antes de compilar. Ahorras tiempo de depuración.

Ejemplo 2 — Arrays tipados

Mercado Libre maneja catálogos de productos. Un array tipado garantiza que cada elemento sea del tipo correcto.

let categorias: string[] = ["Electrónica", "Ropa", "Hogar", "Deportes"];
let precios: number[] = [1200, 350, 890, 650];
let disponible: boolean[] = [true, false, true, true];

console.log(categorias[0]);  // Electrónica
console.log(precios[2]);     // 890

Si agregas un valor del tipo incorrecto, el compilador lo rechaza:

categorias.push(404); // ❌ Error: Argument of type 'number' is not assignable to parameter of type 'string'

Así proteges la integridad de tus listas desde el principio.

Ejemplo 3 — Función con tipos en parámetros y retorno

En Liverpool, una función puede calcular el precio con descuento. Tipas los parámetros y el valor de retorno.

function calcularDescuento(precio: number, porcentaje: number): number {
  return precio - (precio * porcentaje / 100);
}

let precioFinal: number = calcularDescuento(3500, 15);
console.log("Precio con descuento: $" + precioFinal); // Precio con descuento: $2,975

El : number al final de los paréntesis indica el tipo de retorno. Si la función devuelve un string por error, TypeScript lo detecta.

function calcularDescuento(precio: number, porcentaje: number): number {
  return "gratis"; // ❌ Error: Type 'string' is not assignable to type 'number'
}

El tipo any y por qué debes evitarlo

any desactiva la revisión de tipos para esa variable. Es como apagar el antivirus: puedes hacerlo, pero asumes todos los riesgos.

let dato: any = "texto";
dato = 123;     // No hay error
dato = true;    // No hay error
dato = [1,2,3]; // No hay error

El problema es que TypeScript deja de protegerte. Los errores solo aparecen en tiempo de ejecución, no durante la compilación.

Usa any únicamente cuando migras código JavaScript antiguo y aún no conoces el tipo correcto. En código nuevo, siempre define el tipo explícito.

Inferencia de tipos

TypeScript puede inferir el tipo automáticamente si asignas un valor al declarar la variable.

let ciudad = "Monterrey";  // TypeScript infiere: string
let codigo = 64000;        // TypeScript infiere: number
let abierto = false;       // TypeScript infiere: boolean

No necesitas escribir la anotación si el valor inicial es claro. Aun así, en equipos grandes es mejor ser explícito. Facilita la lectura del código.

El tipo void en funciones

Cuando una función no devuelve ningún valor, su tipo de retorno es void.

function mostrarBienvenida(nombre: string): void {
  console.log("Bienvenido, " + nombre);
}

mostrarBienvenida("Ana"); // Bienvenido, Ana

Si intentas usar el resultado de una función void, TypeScript te avisa:

let resultado = mostrarBienvenida("Ana");
console.log(resultado); // ❌ 'resultado' es de tipo 'void'

Esto previene errores lógicos donde usas el retorno de una función que no devuelve nada útil.

Errores comunes

Error 1 — Mezclar tipos sin querer

let totalVentas: number = 45000;
totalVentas = "cuarenta y cinco mil"; // ❌ Error de tipo

Esto ocurre cuando recibes datos de una fuente externa y no los conviertes antes de asignarlos. Usa Number() o parseInt() para convertir strings a números.

let valorTexto: string = "45000";
let totalVentas: number = Number(valorTexto); // ✅ Correcto

Error 2 — Declarar arrays sin tipo y luego mezclar valores

let precios = [100, 200, "trescientos"]; // ❌ TypeScript infiere (number | string)[]

Si no defines el tipo del array desde el inicio, TypeScript acepta una mezcla. Eso genera comportamientos inesperados al procesar los datos.

Declara siempre el tipo explícito del array:

let precios: number[] = [100, 200, 300]; // ✅ Solo números

Error 3 — Olvidar el tipo de retorno en funciones

function obtenerSalario(empleadoId: number) {
  if (empleadoId === 1) return 18500;
  return "no encontrado"; // TypeScript infiere (number | string)
}

Cuando una función puede devolver tipos distintos, el compilador infiere una unión. Eso complica el código que usa la función. Define el tipo de retorno desde el principio y maneja los casos de error con excepciones o valores centinela del mismo tipo.

function obtenerSalario(empleadoId: number): number {
  if (empleadoId === 1) return 18500;
  return 0; // ✅ Siempre devuelve number
}

Tabla de referencia rápida

Situación Tipo correcto Ejemplo
Nombre de persona o empresa string "FEMSA"
Precio o cantidad number 12500
Activar o desactivar algo boolean false
Lista de textos string[] ["a", "b"]
Lista de números number[] [1, 2, 3]
Función sin retorno void
Tipo desconocido (evitar) any

Usa esta tabla como referencia mientras escribes tus primeros archivos .ts.

Puntos clave

Puntos clave

  • Los tipos básicos de TypeScript son `string`, `number`, `boolean` y `array`. Declara siempre el tipo de tus variables para que el compilador te proteja.
  • La sintaxis de anotación de tipo es `nombreVariable: Tipo = valor`. Es simple y consistente en todo el lenguaje.
  • Evita el tipo `any` en código nuevo. Desactiva la revisión de tipos y elimina la principal ventaja de usar TypeScript.
  • TypeScript puede inferir el tipo si asignas un valor al declarar la variable. En equipos grandes, es mejor ser explícito para facilitar la lectura.
  • Tipas también el retorno de tus funciones con `: Tipo` después de los paréntesis. Esto previene que una función devuelva datos inesperados.

Comparte esta lección: