Modificando objetos

javascript objetos

Analogía

Imagina que tienes un perfil en una red social.

Este perfil contiene información sobre ti, como tu nombre de usuario, edad y ubicación. Y habrá ocasiones donde necesites actualizar esta información.

Los objetos en JavaScript funcionan de manera similar.


🔄 Modificando datos existentes

Hay dos formas principales de modificar los datos de un objeto, así como tienes dos formas de referirte a las características de algo:

🔸 Usando la notación punto (.)

let tarjeta = {
nombre: "Ana",
edad: 25,
ciudad: "Madrid",
};
// Actualizamos la edad de Ana
tarjeta.edad = 26;
console.log(tarjeta);

Terminal window
{ nombre: "Ana", edad: 26, ciudad: "Madrid" }

🔹 Usando la notación de corchetes ([])

A veces necesitamos usar palabras con espacios o caracteres especiales, como “fecha de nacimiento”.

En estos casos usamos corchetes, como si fuera un diccionario donde buscamos una palabra específica.

let estudiante = {
"nombre completo": "María López",
"número de lista": 7,
};
estudiante["número de lista"] = 12;
console.log(estudiante);

Terminal window
{ "nombre completo": "María López", "número de lista": 12 }

➕ Agregando nuevos datos

También podemos agregar nueva información a nuestro objeto, como cuando agregas un nuevo sticker a tu tarjeta de identificación:

let perfil = {
usuario: "gamer123",
nivel: 5,
};
// Agregamos una nueva propiedad
perfil.puntos = 1000;
console.log(perfil);

Terminal window
{
usuario: "gamer123",
nivel: 5,
puntos: 1000
}

❌ Eliminando propiedades

Para eliminar una propiedad de un objeto usamos el operador delete:

let usuario = {
nombre: "Carlos",
edad: 30,
};
delete usuario.edad;
console.log(usuario);

Terminal window
{ nombre: "Carlos" }

🪆 Modificando objetos anidados

A veces tenemos objetos dentro de otros objetos. Para modificarlos, usamos la notación punto varias veces:

let videojuego = {
nombre: "Aventura Mágica",
personaje: {
nombre: "Mago",
poderes: ["Fuego", "Hielo"],
},
};
videojuego.personaje.nombre = "Hechicero";
videojuego.personaje.poderes[1] = "Rayo";
console.log(videojuego);

Terminal window
{
nombre: "Aventura Mágica",
personaje: {
nombre: "Hechicero",
poderes: ["Fuego", "Rayo"]
}
}

⚠️ Errores comunes

1. Intentar acceder a propiedades que no existen

let coche = { marca: "Toyota" };
console.log(coche.modelo); // undefined

2. Usar notación punto con nombres que tienen espacios

let persona = { "nombre completo": "Ana García" };
// ❌ Esto dará error
persona.nombre completo = "Luis López";
// ✅ Usar corchetes en su lugar
persona["nombre completo"] = "Luis López";

📝 Resumen
Notación Ejemplo Cuándo usarla
Punto (.) objeto.propiedad Para nombres simples sin espacios
Corchetes ([]) objeto["propiedad"] Para nombres con espacios o variables


☝️🤓
🚀 Extra
Busca información sobre el método Object.assign().

Comentarios