GUÍA · Objetos

Objetos en JavaScript: crear, leer y modificar

Aprende a crear objetos en JavaScript, leer y cambiar propiedades, recorrerlas, copiarlas con spread y evitar el error de las referencias compartidas.

Un objeto agrupa datos relacionados en pares clave-valor, por ejemplo los datos de un libro o de un usuario. Es la estructura básica con la que JavaScript representa casi cualquier entidad.

Crear y leer un objeto

JavaScript
const libro = {
  titulo: 'JavaScript fácil',
  paginas: 120,
  disponible: true
};

console.log(libro.titulo);       // 'JavaScript fácil'
console.log(libro['paginas']);   // 120

Usa la notación de corchetes cuando la clave está en una variable o tiene caracteres especiales:

JavaScript
const campo = 'titulo';
console.log(libro[campo]); // 'JavaScript fácil'

Añadir, cambiar y borrar propiedades

JavaScript
libro.autor = 'Ana';     // añade
libro.paginas = 130;     // cambia
delete libro.disponible; // borra
console.log(libro);
// { titulo: 'JavaScript fácil', paginas: 130, autor: 'Ana' }

Aunque el objeto esté declarado con const, sus propiedades se pueden modificar. Lo que const impide es asignar otro valor a la variable.

Métodos: funciones dentro de un objeto

JavaScript
const contador = {
  valor: 0,
  sumar() {
    this.valor += 1;
  }
};
contador.sumar();
console.log(contador.valor); // 1

Comprobar si existe una propiedad

JavaScript
console.log('titulo' in libro);             // true
console.log(libro.editorial);               // undefined
console.log(libro.editorial ?? 'sin dato'); // 'sin dato'
console.log(libro.autor?.length);           // 3

El operador ?. evita un TypeError cuando algo intermedio puede ser undefined.

Recorrer un objeto

JavaScript
const stock = { te: 3, cafe: 0 };

console.log(Object.keys(stock));    // ['te', 'cafe']
console.log(Object.values(stock));  // [3, 0]

for (const [clave, valor] of Object.entries(stock)) {
  console.log(clave, valor);
}

Desestructurar

JavaScript
const { titulo, paginas } = libro;
console.log(titulo, paginas);

Copiar objetos sin sorpresas

Asignar un objeto a otra variable no lo copia: ambas apuntan al mismo objeto.

JavaScript
const original = { id: 1, activo: false };
const mismo = original;
mismo.activo = true;
console.log(original.activo); // true  (¡cambió!)

const copia = { ...original, activo: false };
console.log(original.activo); // true
console.log(copia.activo);    // false

{ ...objeto } hace una copia superficial: los objetos anidados siguen compartiéndose. Para una copia profunda existe structuredClone(objeto).

Objetos y arrays juntos

Lo habitual es combinarlos: un array de objetos para listas de productos, tareas o usuarios.

JavaScript
const tareas = [
  { id: 1, texto: 'Leer', hecha: false },
  { id: 2, texto: 'Practicar', hecha: true }
];
const pendientes = tareas.filter(t => !t.hecha);
console.log(pendientes.length); // 1

Con esta estructura se construyen los proyectos de este sitio: listas de tareas, catálogos y cuestionarios.

Última actualización: . Los ejemplos se han comprobado en un navegador actual y en Node.js.