En JavaScript, los objetos son una de las estructuras de datos más importantes y versátiles. Permiten almacenar colecciones de datos y más complejas entidades. En esta lección, aprenderás los conceptos básicos sobre los objetos, cómo crearlos y cómo utilizarlos en tus programas.

¿Qué es un Objeto?

Un objeto es una colección de propiedades, y una propiedad es una asociación entre un nombre (o clave) y un valor. Un valor de propiedad puede ser una función, en cuyo caso la propiedad se llama método.

Conceptos Clave

  • Propiedades: Son los valores asociados a un objeto.
  • Métodos: Son funciones que están asociadas a un objeto.
  • Claves: Son los nombres de las propiedades.

Sintaxis Básica

La forma más común de crear un objeto es utilizando la notación de objeto literal, que se define con llaves {}.

let persona = {
    nombre: "Juan",
    edad: 30,
    saludar: function() {
        console.log("Hola, mi nombre es " + this.nombre);
    }
};

En este ejemplo:

  • nombre y edad son propiedades del objeto persona.
  • saludar es un método del objeto persona.

Acceso a Propiedades y Métodos

Puedes acceder a las propiedades y métodos de un objeto utilizando la notación de punto . o la notación de corchetes [].

// Notación de punto
console.log(persona.nombre); // "Juan"
persona.saludar(); // "Hola, mi nombre es Juan"

// Notación de corchetes
console.log(persona["edad"]); // 30

Modificación de Propiedades

Puedes modificar las propiedades de un objeto en cualquier momento.

persona.nombre = "Carlos";
console.log(persona.nombre); // "Carlos"

Añadir y Eliminar Propiedades

Puedes añadir nuevas propiedades a un objeto o eliminar las existentes.

// Añadir una nueva propiedad
persona.ocupacion = "Desarrollador";
console.log(persona.ocupacion); // "Desarrollador"

// Eliminar una propiedad
delete persona.edad;
console.log(persona.edad); // undefined

Ejemplo Práctico

Vamos a crear un objeto coche con algunas propiedades y métodos, y luego interactuar con él.

let coche = {
    marca: "Toyota",
    modelo: "Corolla",
    año: 2020,
    encender: function() {
        console.log("El coche está encendido.");
    },
    apagar: function() {
        console.log("El coche está apagado.");
    }
};

// Acceder a propiedades
console.log(coche.marca); // "Toyota"
console.log(coche["modelo"]); // "Corolla"

// Llamar a métodos
coche.encender(); // "El coche está encendido."
coche.apagar(); // "El coche está apagado."

// Modificar propiedades
coche.año = 2021;
console.log(coche.año); // 2021

// Añadir y eliminar propiedades
coche.color = "Rojo";
console.log(coche.color); // "Rojo"

delete coche.modelo;
console.log(coche.modelo); // undefined

Ejercicio Práctico

Ejercicio 1

Crea un objeto libro con las siguientes propiedades y métodos:

  • titulo (cadena)
  • autor (cadena)
  • año (número)
  • leer (método que imprime "Estás leyendo [titulo] de [autor]")

Solución

let libro = {
    titulo: "Cien Años de Soledad",
    autor: "Gabriel García Márquez",
    año: 1967,
    leer: function() {
        console.log("Estás leyendo " + this.titulo + " de " + this.autor);
    }
};

// Acceder a propiedades
console.log(libro.titulo); // "Cien Años de Soledad"
console.log(libro.autor); // "Gabriel García Márquez"

// Llamar al método
libro.leer(); // "Estás leyendo Cien Años de Soledad de Gabriel García Márquez"

// Modificar propiedades
libro.año = 1970;
console.log(libro.año); // 1970

// Añadir y eliminar propiedades
libro.genero = "Realismo mágico";
console.log(libro.genero); // "Realismo mágico"

delete libro.año;
console.log(libro.año); // undefined

Conclusión

En esta lección, hemos aprendido los conceptos básicos sobre los objetos en JavaScript, cómo crearlos, acceder a sus propiedades y métodos, y cómo modificarlos. Los objetos son fundamentales en JavaScript y se utilizan ampliamente en la programación orientada a objetos y en la manipulación del DOM.

En la próxima lección, profundizaremos en los métodos de objeto y la palabra clave this, que es crucial para entender cómo funcionan los métodos dentro de los objetos.

JavaScript: De Principiante a Avanzado

Módulo 1: Introducción a JavaScript

Módulo 2: Estructuras de Control

Módulo 3: Funciones

Módulo 4: Objetos y Arrays

Módulo 5: Objetos y Funciones Avanzadas

Módulo 6: El Modelo de Objetos del Documento (DOM)

Módulo 7: APIs del Navegador y Temas Avanzados

Módulo 8: Pruebas y Depuración

Módulo 9: Rendimiento y Optimización

Módulo 10: Frameworks y Librerías de JavaScript

Módulo 11: Proyecto Final

© Copyright 2024. Todos los derechos reservados