CAP 02 · LEC 03·Sintaxis
Operadores: aritméticos, de comparación y lógicos
Los operadores son los verbos del lenguaje: hacen cosas con los valores. Desde sumar números hasta comparar objetos — esta lección cubre todo lo que necesitas saber para escribir lógica real.
¿Encontraste un error o algo que mejorar?Editá esta lección en GitHub →
Operadores aritméticos
console.log(5 + 3); // 8 — suma
console.log(10 - 4); // 6 — resta
console.log(3 * 4); // 12 — multiplicación
console.log(15 / 4); // 3.75 — división
console.log(15 % 4); // 3 — módulo (resto)
console.log(2 ** 8); // 256 — potencia
// Incremento / decremento
let n = 5;
n++; // n = 6 (post-incremento)
++n; // n = 7 (pre-incremento)
n--; // n = 6
--n; // n = 5
// Asignación compuesta
n += 10; // n = 15
n -= 5; // n = 10
n *= 2; // n = 20
n /= 4; // n = 5
n **= 2; // n = 25Operadores de comparación
// Igualdad estricta (recomendada)
console.log(5 === 5); // true
console.log(5 === "5"); // false — tipos diferentes
// Igualdad débil (evitar)
console.log(5 == "5"); // true — coerciona el tipo!
console.log(null == undefined); // true
// Desigualdad
console.log(5 !== 3); // true
console.log(5 != "5"); // false (débil)
// Mayor / menor
console.log(5 > 3); // true
console.log(5 >= 5); // true
console.log(3 < 5); // true
console.log(3 <= 2); // false// TypeScript impide comparaciones sin sentido
const num: number = 5;
const str: string = "5";
console.log(num === str); // ❌ This comparison appears to be unintentional
// porque 'number' y 'string' no se solapan
// Con tipos correctos funciona:
const a: number = 5;
const b: number = 5;
console.log(a === b); // ✅ trueSiempre usa === en lugar de ==
La igualdad débil == hace coerción de tipos y produce resultados sorprendentes: "" == false es true, 0 == false es true. Usa === siempre.
Operadores lógicos
// AND: true solo si ambos son true
console.log(true && true); // true
console.log(true && false); // false
// OR: true si al menos uno es true
console.log(false || true); // true
console.log(false || false); // false
// NOT: invierte el valor
console.log(!true); // false
console.log(!false); // true
// Short-circuit evaluation
const usuario = null;
const nombre = usuario && usuario.nombre; // null (no evalúa .nombre)
const config = null;
const host = config || "localhost"; // "localhost"
// Nullish coalescing (solo reacciona a null/undefined)
const valor = 0;
console.log(valor || "default"); // "default" (malo: 0 es falsy)
console.log(valor ?? "default"); // 0 (correcto: 0 no es null/undefined)// Logical assignment (ES2021 + TS)
let a: number | null = null;
a ??= 42; // si a es null o undefined, asigna 42
console.log(a); // 42
let b = 10;
b ||= 0; // si b es falsy, asigna 0 (no cambia porque 10 es truthy)
console.log(b); // 10
let c = 0;
c &&= 5; // si c es truthy, asigna 5 (no cambia porque 0 es falsy)
console.log(c); // 0Operador ternario
El operador ? : es una forma compacta de if/else para expresiones.
const edad = 20;
// if/else equivalente
let acceso;
if (edad >= 18) {
acceso = "permitido";
} else {
acceso = "denegado";
}
// Con ternario (una línea)
const acceso2 = edad >= 18 ? "permitido" : "denegado";
console.log(acceso2); // "permitido"Salida
permitidoCuándo usar ternario
Úsalo para asignaciones simples de dos valores. Si la lógica es más compleja, usa if/else — el código legible siempre gana sobre el código compacto.
Operadores con strings
// Concatenación con +
const nombre = "Ana";
const apellido = "López";
const completo = nombre + " " + apellido;
console.log(completo); // "Ana López"
// Template literals (preferido)
console.log(`${nombre} ${apellido}`); // "Ana López"
// Repetición
console.log("ha".repeat(3)); // "hahaha"
// Spread en string
console.log([..."hola"]); // ["h", "o", "l", "a"]Practica
4 ejercicios para dominar los operadores.