Objetos en JavaScript

Los objetos en JavaScript son estructuras de datos fundamentales que te permiten organizar y agrupar información relacionada. Son como cajas que contienen diferentes propiedades (como nombre, color, tamaño) y métodos (como acciones que se pueden realizar). Dominar los objetos es clave para escribir código JavaScript más eficiente, flexible y escalable.

¿Qué es un objeto en JavaScript?

Un objeto es una colección de pares clave-valor. Las claves son como etiquetas que identifican a cada valor. Los valores pueden ser cualquier tipo de dato en JavaScript, como números, cadenas, booleanos, arreglos e incluso otros objetos.

Ejemplo:


const persona = {
  nombre: "Ana",
  edad: 25,
  ciudad: "Lima",
  hablar: function() {
    console.log("Hola, mi nombre es Ana!");
  }
};

Lenguaje del código: JavaScript (javascript)

En este ejemplo, «persona» es un objeto con cuatro propiedades: «nombre», «edad», «ciudad» y «hablar». «hablar» es un método que define una acción que el objeto puede realizar.

¿Cómo crear objetos?

Existen dos formas principales de crear objetos:

1. Notación literal:


const persona = {
  nombre: "Ana",
  edad: 25,
  ciudad: "Lima",
  hablar: function() {
    console.log("Hola, mi nombre es Ana!");
  }
};

Lenguaje del código: JavaScript (javascript)

2. Constructor Object:


const persona = new Object();
persona.nombre = "Ana";
persona.edad = 25;
persona.ciudad = "Lima";
persona.hablar = function() {
  console.log("Hola, mi nombre es Ana!");
};

Lenguaje del código: JavaScript (javascript)

¿Cómo acceder a las propiedades y métodos de un objeto?

1. Notación de punto:


const nombre = persona.nombre; // "Ana"
persona.hablar(); // "Hola, mi nombre es Ana!"

Lenguaje del código: JavaScript (javascript)

2. Notación de corchetes:


const nombre = persona["nombre"]; // "Ana"
persona["hablar"](); // "Hola, mi nombre es Ana!"

Lenguaje del código: JavaScript (javascript)

Métodos útiles para trabajar con objetos:

  • Object.keys(objeto): Obtiene un array con las claves del objeto.
  • Object.values(objeto): Obtiene un array con los valores del objeto.
  • Object.entries(objeto): Obtiene un array con pares clave-valor del objeto.
  • Object.assign(objetoDestino, objetoOrigen): Copia las propiedades del objetoOrigen al objetoDestino.

Ejemplos prácticos:

1. Crear un objeto para representar un libro:


const libro = {
  titulo: "Cien años de soledad",
  autor: "Gabriel García Márquez",
  año: 1967,
  resumen: "Una novela que narra la historia de la familia Buendía a través de siete generaciones en el Macondo ficticio.",
  leer: function() {
    console.log("Estoy leyendo Cien años de soledad");
  }
};

Lenguaje del código: JavaScript (javascript)

2. Crear un objeto para representar un carrito de compras:


const carrito = {
  productos: [],
  total: 0,
  agregarProducto(producto) {
    this.productos.push(producto);
    this.total += producto.precio;
  },
  quitarProducto(producto) {
    const indice = this.productos.indexOf(producto);
    if (indice !== -1) {
      this.productos.splice(indice, 1);
      this.total -= producto.precio;
    }
  },
  vaciarCarrito() {
    this.productos = [];
    this.total = 0;
  }
};

Lenguaje del código: JavaScript (javascript)

Conclusión:

Los objetos son una herramienta fundamental en JavaScript. Dominar su uso te permite escribir código más organizado, eficiente y reutilizable. Dedica tiempo a practicar con los ejemplos y explorar las posibilidades que ofrecen los objetos para llevar tu desarrollo web al siguiente nivel.