Si eres programador de JavaScript, seguro te has topado con problemas que parecen sencillos pero que, si no los resuelves bien, pueden convertirse en un dolor de cabeza. Hoy te voy a mostrar cómo resolver algunos de los problemas más comunes de manera eficiente y sin complicarte la vida.
Formatear fechas de manera elegante
Uno de los clásicos: tienes una fecha y necesitas mostrarla de manera amigable. En lugar de pelear con los métodos nativos de Date
, usa Intl.DateTimeFormat:
const fecha = new Date();
const formato = new Intl.DateTimeFormat('es-PR', { dateStyle: 'medium' }).format(fecha);
console.log(formato); // Ejemplo de salida: 5 feb 2025
Si quieres algo más flexible, usa date-fns:
import { format } from 'date-fns';
import { es } from 'date-fns/locale';
console.log(format(new Date(), "dd 'de' MMMM yyyy", { locale: es })); // 05 de febrero 2025
Convertir números en formato de dinero
Cuando manejas precios, necesitas asegurarte de que siempre se vean bien. Para eso, Intl.NumberFormat es tu mejor amigo:
const precio = 2500.5;
const formatoMoneda = new Intl.NumberFormat('es-PR', {
style: 'currency',
currency: 'USD'
}).format(precio);
console.log(formatoMoneda); // $2,500.50
Evitar valores undefined
o null
en strings
Muchas veces recibes valores de una API y no quieres que tu interfaz se rompa mostrando undefined
o null
. Usa el operador de coalescencia nula (??
) para darle un valor seguro:
const nombre = usuario.nombre ?? 'Invitado';
console.log(`Hola, ${nombre}`); // Si usuario.nombre es null o undefined, muestra 'Hola, Invitado'
Eliminar duplicados en un array
Si necesitas asegurarte de que un array solo tenga valores únicos, la forma más limpia es usando Set:
const numeros = [1, 2, 2, 3, 4, 4, 5];
const numerosUnicos = [...new Set(numeros)];
console.log(numerosUnicos); // [1, 2, 3, 4, 5]
Copiar objetos sin referencia
En JavaScript, si copias un objeto de forma directa, cualquier cambio en la copia afectará el original. Para evitarlo, usa el spread operator o structuredClone:
const original = { a: 1, b: { c: 2 } };
const copia = structuredClone(original);
copia.b.c = 99;
console.log(original.b.c); // 2 (el original se mantiene intacto)
Comprobar si un objeto está vacío
En lugar de hacer verificaciones manuales, usa Object.keys():
const obj = {};
console.log(Object.keys(obj).length === 0); // true
O si quieres algo más elegante:
const estaVacio = obj => Object.keys(obj).length === 0;
console.log(estaVacio({})); // true
console.log(estaVacio({ a: 1 })); // false
Uso de Array.map
para transformar datos
Cuando necesitas modificar cada elemento de un array sin alterar el original, usa map
:
const numeros = [1, 2, 3, 4];
const cuadrados = numeros.map(num => num * num);
console.log(cuadrados); // [1, 4, 9, 16]
Uso de Array.reduce
para sumar valores
Si necesitas obtener un valor acumulado, como la suma de los elementos de un array, usa reduce
:
const precios = [10, 20, 30, 40];
const total = precios.reduce((acc, precio) => acc + precio, 0);
console.log(total); // 100
En fin…
JavaScript tiene soluciones limpias y eficientes para problemas comunes. Conociendo estos trucos, puedes escribir código más claro, mantenible y profesional. ¿Tienes algún otro problema recurrente en JS? ¡Déjamelo saber en los comentarios y lo resolvemos juntos!
Resuelve problemas comunes en JavaScript como un PRO
Roberto Torres Rodríguez
Related posts
Publicaciones Populares
Categorías
- ASP.Net (6)
- C# (10)
- CSS (5)
- DIY (1)
- General (5)
- IA (1)
- JavaScript (9)
- JQuery (6)
- Kodi (antes XBMC) (4)
- Nuevo (3)
- Raspberry Pi (2)
- SQL Server (15)
- Uncategorized (1)
- Vue.js (2)
- Wordpress (1)