Objetos: Propiedades y Métodos

Aprende a trabajar con objetos en JavaScript, la estructura fundamental para organizar y manipular datos relacionados.

1. ¿Qué son los Objetos?

Un objeto es una colección de pares clave-valor. Es como una caja que contiene información relacionada, donde cada dato tiene un nombre (clave) y un valor.

En JavaScript, los objetos usan la sintaxis JSON (JavaScript Object Notation): { clave: valor }

Diferencia con Java: No necesitas crear una clase primero. Puedes crear objetos directamente.

Comparación con Java

Java

Java - Necesitas una clasejava

1// Primero debes crear una clase
2public class Persona {
3    public String nombre;
4    public int edad;
5 
6    public Persona(String nombre, int edad) {
7        this.nombre = nombre;
8        this.edad = edad;
9    }
10}
11 
12// Luego crear instancias
13Persona juan = new Persona("Juan", 25);

JavaScript

JavaScript - Objetos directosjavascript

1// Creas objetos directamente
2// Sintaxis: { clave: valor }
3const juan = {
4    nombre: "Juan",
5    edad: 25
6};
7 
8// ¡Así de simple!

2. Crear Objetos (Object Literals)

Crear objetosjavascript

1// Objeto vacío
2const objetoVacio = {};
3 
4// Objeto con propiedades
5const persona = {
6    nombre: "Ana",
7    edad: 28,
8    ciudad: "Madrid"
9};
10 
11console.log(persona);
12// { nombre: "Ana", edad: 28, ciudad: "Madrid" }
13 
14// Los valores pueden ser de cualquier tipo
15const producto = {
16    id: 101,
17    nombre: "Laptop",
18    precio: 899.99,
19    disponible: true,
20    categorias: ["Electrónica", "Computadoras"],
21    especificaciones: {
22        ram: "16GB",
23        procesador: "Intel i7"
24    }
25};

3. Propiedades

Acceder a propiedades

Acceder a propiedadesjavascript

1const persona = {
2    nombre: "Carlos",
3    edad: 30,
4    profesion: "Desarrollador"
5};
6 
7// Notación de punto (más común)
8console.log(persona.nombre);      // "Carlos"
9console.log(persona.edad);        // 30
10 
11// Notación de corchetes (útil con variables)
12console.log(persona["profesion"]); // "Desarrollador"
13 
14// Con variables
15const propiedad = "nombre";
16console.log(persona[propiedad]);   // "Carlos"

Modificar propiedades

Modificar propiedadesjavascript

1const persona = {
2    nombre: "María",
3    edad: 25
4};
5 
6// Modificar propiedades existentes
7persona.edad = 26;
8persona["nombre"] = "María García";
9 
10console.log(persona);
11// { nombre: "María García", edad: 26 }

Añadir propiedades dinámicamente

Añadir propiedadesjavascript

1const persona = {
2    nombre: "Pedro"
3};
4 
5// Añadir nuevas propiedades
6persona.edad = 35;
7persona.ciudad = "Barcelona";
8persona["profesion"] = "Ingeniero";
9 
10console.log(persona);
11// { nombre: "Pedro", edad: 35, ciudad: "Barcelona", profesion: "Ingeniero" }

💡 Diferencia con Java

En Java, los campos de un objeto están fijos por la clase. En JavaScript, puedes añadir o eliminar propiedades en cualquier momento. Los objetos son dinámicos y flexibles.

Eliminar propiedades

Eliminar propiedadesjavascript

1const persona = {
2    nombre: "Luis",
3    edad: 40,
4    ciudad: "Valencia"
5};
6 
7// Eliminar una propiedad
8delete persona.ciudad;
9 
10console.log(persona);
11// { nombre: "Luis", edad: 40 }

4. Métodos

Un método es una función que pertenece a un objeto. Es como una acción que el objeto puede realizar.

Crear métodos

Métodos en objetosjavascript

1const persona = {
2    nombre: "Ana",
3    edad: 28,
4 
5    // Método: función dentro del objeto
6    saludar: function() {
7        console.log("Hola, soy " + this.nombre);
8    },
9 
10    // Sintaxis corta (ES6)
11    despedirse() {
12        console.log("Adiós!");
13    }
14};
15 
16persona.saludar();     // "Hola, soy Ana"
17persona.despedirse();  // "Adiós!"

La palabra clave 'this'

Uso de 'this'javascript

1const calculadora = {
2    num1: 10,
3    num2: 5,
4 
5    sumar() {
6        // 'this' hace referencia al objeto actual
7        return this.num1 + this.num2;
8    },
9 
10    restar() {
11        return this.num1 - this.num2;
12    },
13 
14    info() {
15        console.log(`Números: ${this.num1} y ${this.num2}`);
16    }
17};
18 
19console.log(calculadora.sumar());  // 15
20console.log(calculadora.restar()); // 5
21calculadora.info();                // "Números: 10 y 5"

💡 ¿Qué es 'this'?

this es una referencia al objeto que está ejecutando el método. Es similar al this de Java, pero en JavaScript su comportamiento puede cambiar según el contexto.

5. Diferencias Clave con Java

❌ En Java

• Necesitas crear una clase primero
• Los campos están fijos en la clase
• Los tipos de datos están declarados
• Más estructura y rigidez

✅ En JavaScript

• Creas objetos directamente sin clases
• Las propiedades son dinámicas (añadir/eliminar en cualquier momento)
• Sin tipos declarados
• Más flexibilidad

6. Ejercicios Prácticos

Ejercicio 1: Crear un objeto Producto

Crea un objeto que represente un producto con las propiedades: nombre, precio, stock y disponible.

Planteamientojavascript

1// Tu código aquí
2 
3 
4 
5 
6console.log(producto.nombre);      // "Mouse Gamer"
7console.log(producto.precio);      // 29.99
8console.log(producto.disponible);  // true

Ver solución

Soluciónjavascript

1const producto = {
2    nombre: "Mouse Gamer",
3    precio: 29.99,
4    stock: 15,
5    disponible: true
6};
7 
8console.log(producto.nombre);      // "Mouse Gamer"
9console.log(producto.precio);      // 29.99
10console.log(producto.disponible);  // true

Ejercicio 2: Añadir y modificar propiedades

Dado un objeto persona, añade una propiedad "email" y modifica la edad a 31.

Planteamientojavascript

1const persona = {
2    nombre: "Laura",
3    edad: 30
4};
5 
6// Tu código aquí
7 
8 
9 
10 
11console.log(persona);
12// { nombre: "Laura", edad: 31, email: "laura@email.com" }

Ver solución

Soluciónjavascript

1const persona = {
2    nombre: "Laura",
3    edad: 30
4};
5 
6// Modificar edad
7persona.edad = 31;
8 
9// Añadir email
10persona.email = "laura@email.com";
11 
12console.log(persona);
13// { nombre: "Laura", edad: 31, email: "laura@email.com" }

Ejercicio 3: Crear métodos

Crea un objeto "coche" con propiedades marca, modelo y un método "info()" que muestre la información del coche.

Planteamientojavascript

1// Tu código aquí
2 
3 
4 
5 
6 
7 
8coche.info(); // "Coche: Toyota Corolla"

Ver solución

Soluciónjavascript

1const coche = {
2    marca: "Toyota",
3    modelo: "Corolla",
4 
5    info() {
6        console.log(`Coche: ${this.marca} ${this.modelo}`);
7    }
8};
9 
10coche.info(); // "Coche: Toyota Corolla"
11 
12// Versión alternativa con función tradicional
13const coche2 = {
14    marca: "Honda",
15    modelo: "Civic",
16 
17    info: function() {
18        console.log(`Coche: ${this.marca} ${this.modelo}`);
19    }
20};

Ejercicio 4: Calculadora con métodos

Crea un objeto calculadora con dos números y métodos para sumar, restar, multiplicar y dividir.

Planteamientojavascript

1// Tu código aquí
2 
3 
4 
5 
6 
7 
8 
9 
10 
11 
12console.log(calculadora.sumar());       // 15
13console.log(calculadora.multiplicar()); // 50

Ver solución

Soluciónjavascript

1const calculadora = {
2    a: 10,
3    b: 5,
4 
5    sumar() {
6        return this.a + this.b;
7    },
8 
9    restar() {
10        return this.a - this.b;
11    },
12 
13    multiplicar() {
14        return this.a * this.b;
15    },
16 
17    dividir() {
18        if (this.b === 0) {
19            return "Error: división entre 0";
20        }
21        return this.a / this.b;
22    }
23};
24 
25console.log(calculadora.sumar());       // 15
26console.log(calculadora.restar());      // 5
27console.log(calculadora.multiplicar()); // 50
28console.log(calculadora.dividir());     // 2

Anterior: Funciones Siguiente: POO en JavaScript →