Objetos en JavaScript:
JavaScript es un lenguaje orientado a objetos. Un objeto es una entidad
que agrupa propiedades (valores) y métodos (funciones) que describen su
comportamiento.
Ejemplo: Piensa en la clase “Casa”, con atributos como
dirección, número de habitaciones y metros cuadrados. Cada casa concreta
(objeto) tendrá valores específicos para esos atributos.
Clases:
Una clase es como un plano o plantilla que define la estructura y el
comportamiento de un objeto. En ES6, la palabra reservada
class hace la sintaxis para definir clases más clara y
sencilla.
Desde ECMAScript 2015 (ES6) se introduce una sintaxis especial para definir clases, reemplazando las viejas funciones constructoras (aunque detrás de cámaras sigue basándose en prototipos).
Ejemplo básico de clase:
class Persona {
constructor(nombre, edad) {
this.nombre = nombre;
this.edad = edad;
}
}Con esta definición, la clase Persona establece el
“cómo” debe ser un objeto de tipo persona.
El método constructor es una función especial que se
ejecuta al crear una nueva instancia (objeto) de la clase. Dentro del
constructor se inicializan las propiedades del objeto usando
this.
Ejemplo con constructor sin y con parámetros:
// Constructor con parámetros
class Animal {
constructor(nombre, especie) {
this.nombre = nombre;
this.especie = especie;
}
}
let miAnimal = new Animal("Firulais", "Perro");
console.log(miAnimal.nombre); // "Firulais"Si no se pasan parámetros, puedes asignar valores por defecto:
class Auto {
constructor(marca = "Desconocida", modelo = "Desconocido") {
this.marca = marca;
this.modelo = modelo;
}
}
let miAuto = new Auto();
console.log(miAuto); // { marca: "Desconocida", modelo: "Desconocido" }Para crear un objeto a partir de una clase, se usa la palabra clave
new junto al nombre de la clase, pasando los parámetros
necesarios al constructor.
Ejemplo de instanciación y acceso a propiedades:
class Producto {
constructor(nombre, precio) {
this.nombre = nombre;
this.precio = precio;
}
}
let producto1 = new Producto("Tablet", 350);
console.log(producto1.nombre); // Acceso con notación de punto
console.log(producto1['precio']); // Acceso usando corchetes
// Modificando una propiedad
producto1.precio = 300;
console.log(producto1.precio); // 300También puedes crear objetos literales, que son estructuras fijas sin necesidad de definiciones previas:
let usuario = {
nombre: "María",
edad: 27,
saludar: function() {
console.log("Hola, soy " + this.nombre);
}
};
usuario.saludar(); // "Hola, soy María"Los métodos son funciones definidas dentro de una clase que permiten interactuar con las propiedades del objeto.
Ejemplo de clase con método:
class Estudiante {
constructor(nombre, carrera) {
this.nombre = nombre;
this.carrera = carrera;
}
presentarse() {
console.log(`Hola, soy ${this.nombre} y estudio ${this.carrera}`);
}
}
const alumno = new Estudiante("Carlos", "Ingeniería");
alumno.presentarse(); // "Hola, soy Carlos y estudio Ingeniería"La herencia permite que una clase (la clase hija) extienda de otra
(la clase padre), heredando sus propiedades y métodos. Se utiliza la
palabra clave extends junto con super() para
llamar al constructor de la clase padre.
Ejemplo de herencia:
class Animal {
constructor(nombre) {
this.nombre = nombre;
}
hablar() {
console.log(`${this.nombre} hace un sonido.`);
}
}
class Perro extends Animal {
constructor(nombre, raza) {
super(nombre); // Llama al constructor de la clase padre
this.raza = raza;
}
// Sobrescribe el método hablar
hablar() {
console.log(`${this.nombre} ladra.`);
}
}
const miPerro = new Perro("Rex", "Pastor Alemán");
miPerro.hablar(); // "Rex ladra."Además, puedes acceder a métodos del padre usando
super.metodo():
class Gato extends Animal {
constructor(nombre, color) {
super(nombre);
this.color = color;
}
hablar() {
super.hablar(); // Llama al método hablar del padre
console.log(`${this.nombre}, el gato de color ${this.color}, maúlla.`);
}
}
const miGato = new Gato("Misu", "gris");
miGato.hablar();
// Salida:
// "Misu hace un sonido."
// "Misu, el gato de color gris, maúlla."Los getters y setters permiten controlar el acceso y la modificación
de las propiedades de un objeto, promoviendo el principio de
encapsulación.
Consejo: Usar un guion bajo (_) en el
nombre de la propiedad interna para evitar conflictos.
Ejemplo de getters y setters:
class Telefono {
constructor(marca) {
this._marca = marca; // Propiedad interna
}
get marca() {
return this._marca;
}
set marca(nuevaMarca) {
this._marca = nuevaMarca;
}
}
let miTelefono = new Telefono("Google");
console.log(miTelefono.marca); // "Google"
miTelefono.marca = "iPhone";
console.log(miTelefono.marca); // "iPhone"Los métodos estáticos pertenecen a la clase en sí y se utilizan sin
instanciar objetos. Se definen colocando la palabra static
antes del nombre del método.
Ejemplo de método estático:
class Rectangulo {
constructor(base, altura) {
this.base = base;
this.altura = altura;
}
calcularArea() {
return this.base * this.altura;
}
// Método estático: se usa para calcular el área sin necesidad de una instancia
static area(base, altura) {
return base * altura;
}
}
console.log(Rectangulo.area(5, 10)); // 50
// Llamada a un método de instancia:
let miRectangulo = new Rectangulo(5, 10);
console.log(miRectangulo.calcularArea()); // 50Nota: Si intentas llamar un método estático desde un objeto instanciado (por ejemplo,
miRectangulo.area()), se producirá un error.
JSON es un formato de texto estándar utilizado para el intercambio de
datos. JavaScript dispone del objeto global JSON que nos
ayuda a convertir objetos a cadenas y viceversa.
Ejemplo:
// Objeto literal
let coche = { marca: "Seat", modelo: "Ibiza", anyo: 2000 };
// Convertir objeto a cadena JSON
let textoJSON = JSON.stringify(coche);
console.log(textoJSON); // {"marca":"Seat","modelo":"Ibiza","anyo":2000}
// Convertir cadena JSON a objeto
let cocheReconstruido = JSON.parse(textoJSON);
console.log(cocheReconstruido.marca); // "Seat"Antes de la introducción de la sintaxis class en ES6, se
usaban las funciones constructoras para definir “clases” y crear
objetos.
Ejemplo en estilo JS5:
// Función constructora
function Coche(marca, modelo) {
this.marca = marca;
this.modelo = modelo;
this.mostrarCoche = function() {
console.log("Marca: " + this.marca + ", Modelo: " + this.modelo);
};
}
// Creando un objeto (instanciando)
let miCocheJS5 = new Coche("Seat", "Ibiza");
miCocheJS5.mostrarCoche(); // "Marca: Seat, Modelo: Ibiza"