La Programación Orientada a Objetos (POO) es un paradigma de programación que utiliza "objetos" y sus interacciones para diseñar aplicaciones y programas. JavaScript, aunque no es un lenguaje puramente orientado a objetos, soporta la POO a través de prototipos y, más recientemente, con la introducción de la sintaxis de clases en ES6.

Conceptos Clave de la POO

  1. Clases: Plantillas para crear objetos.
  2. Objetos: Instancias de clases.
  3. Métodos: Funciones asociadas a un objeto.
  4. Propiedades: Variables asociadas a un objeto.
  5. Herencia: Capacidad de una clase de heredar propiedades y métodos de otra clase.
  6. Encapsulamiento: Agrupación de datos y métodos que operan sobre esos datos en una sola unidad.
  7. Polimorfismo: Capacidad de diferentes clases de ser tratadas como instancias de la misma clase a través de una interfaz común.

Definición de Clases en JavaScript

En JavaScript, una clase se define utilizando la palabra clave class. Aquí hay un ejemplo básico:

class Persona {
    constructor(nombre, edad) {
        this.nombre = nombre;
        this.edad = edad;
    }

    saludar() {
        console.log(`Hola, mi nombre es ${this.nombre} y tengo ${this.edad} años.`);
    }
}

// Crear una instancia de la clase Persona
const persona1 = new Persona('Juan', 30);
persona1.saludar(); // Hola, mi nombre es Juan y tengo 30 años.

Explicación del Código

  1. Definición de la Clase:

    class Persona {
        constructor(nombre, edad) {
            this.nombre = nombre;
            this.edad = edad;
        }
    }
    
    • class Persona: Define una nueva clase llamada Persona.
    • constructor(nombre, edad): El constructor es un método especial para crear e inicializar un objeto creado con una clase. En este caso, inicializa las propiedades nombre y edad.
  2. Método de la Clase:

    saludar() {
        console.log(`Hola, mi nombre es ${this.nombre} y tengo ${this.edad} años.`);
    }
    
    • saludar(): Define un método llamado saludar que imprime un mensaje en la consola.
  3. Instanciación de la Clase:

    const persona1 = new Persona('Juan', 30);
    persona1.saludar(); // Hola, mi nombre es Juan y tengo 30 años.
    
    • new Persona('Juan', 30): Crea una nueva instancia de la clase Persona con el nombre 'Juan' y la edad 30.
    • persona1.saludar(): Llama al método saludar en la instancia persona1.

Herencia en JavaScript

La herencia permite que una clase (subclase) herede propiedades y métodos de otra clase (superclase). En JavaScript, esto se hace utilizando la palabra clave extends.

class Estudiante extends Persona {
    constructor(nombre, edad, grado) {
        super(nombre, edad);
        this.grado = grado;
    }

    estudiar() {
        console.log(`${this.nombre} está estudiando en el grado ${this.grado}.`);
    }
}

// Crear una instancia de la clase Estudiante
const estudiante1 = new Estudiante('Ana', 22, 'Universidad');
estudiante1.saludar(); // Hola, mi nombre es Ana y tengo 22 años.
estudiante1.estudiar(); // Ana está estudiando en el grado Universidad.

Explicación del Código

  1. Definición de la Subclase:

    class Estudiante extends Persona {
        constructor(nombre, edad, grado) {
            super(nombre, edad);
            this.grado = grado;
        }
    }
    
    • class Estudiante extends Persona: Define una nueva clase Estudiante que hereda de Persona.
    • super(nombre, edad): Llama al constructor de la superclase Persona para inicializar las propiedades nombre y edad.
  2. Método de la Subclase:

    estudiar() {
        console.log(`${this.nombre} está estudiando en el grado ${this.grado}.`);
    }
    
    • estudiar(): Define un método llamado estudiar que imprime un mensaje en la consola.
  3. Instanciación de la Subclase:

    const estudiante1 = new Estudiante('Ana', 22, 'Universidad');
    estudiante1.saludar(); // Hola, mi nombre es Ana y tengo 22 años.
    estudiante1.estudiar(); // Ana está estudiando en el grado Universidad.
    
    • new Estudiante('Ana', 22, 'Universidad'): Crea una nueva instancia de la clase Estudiante con el nombre 'Ana', la edad 22 y el grado 'Universidad'.
    • estudiante1.saludar(): Llama al método saludar heredado de Persona.
    • estudiante1.estudiar(): Llama al método estudiar en la instancia estudiante1.

Ejercicio Práctico

Ejercicio

  1. Define una clase Animal con las propiedades nombre y sonido.
  2. Define un método hacerSonido que imprima el sonido del animal.
  3. Define una subclase Perro que herede de Animal y tenga una propiedad adicional raza.
  4. Define un método ladrar en la clase Perro que imprima un mensaje específico para perros.

Solución

class Animal {
    constructor(nombre, sonido) {
        this.nombre = nombre;
        this.sonido = sonido;
    }

    hacerSonido() {
        console.log(`${this.nombre} hace ${this.sonido}`);
    }
}

class Perro extends Animal {
    constructor(nombre, sonido, raza) {
        super(nombre, sonido);
        this.raza = raza;
    }

    ladrar() {
        console.log(`${this.nombre}, el ${this.raza}, está ladrando: ${this.sonido}`);
    }
}

// Crear una instancia de la clase Perro
const miPerro = new Perro('Rex', 'guau guau', 'Labrador');
miPerro.hacerSonido(); // Rex hace guau guau
miPerro.ladrar(); // Rex, el Labrador, está ladrando: guau guau

Explicación del Código

  1. Clase Animal:

    class Animal {
        constructor(nombre, sonido) {
            this.nombre = nombre;
            this.sonido = sonido;
        }
    
        hacerSonido() {
            console.log(`${this.nombre} hace ${this.sonido}`);
        }
    }
    
    • Define la clase Animal con las propiedades nombre y sonido.
    • Define el método hacerSonido que imprime el sonido del animal.
  2. Subclase Perro:

    class Perro extends Animal {
        constructor(nombre, sonido, raza) {
            super(nombre, sonido);
            this.raza = raza;
        }
    
        ladrar() {
            console.log(`${this.nombre}, el ${this.raza}, está ladrando: ${this.sonido}`);
        }
    }
    
    • Define la subclase Perro que hereda de Animal.
    • Añade la propiedad raza.
    • Define el método ladrar que imprime un mensaje específico para perros.
  3. Instanciación de la Subclase:

    const miPerro = new Perro('Rex', 'guau guau', 'Labrador');
    miPerro.hacerSonido(); // Rex hace guau guau
    miPerro.ladrar(); // Rex, el Labrador, está ladrando: guau guau
    
    • Crea una instancia de la clase Perro con el nombre 'Rex', el sonido 'guau guau' y la raza 'Labrador'.
    • Llama a los métodos hacerSonido y ladrar en la instancia miPerro.

Conclusión

En esta sección, hemos cubierto los conceptos básicos de la Programación Orientada a Objetos en JavaScript, incluyendo la definición de clases, la creación de instancias, y la herencia. Estos conceptos son fundamentales para escribir código más estructurado y reutilizable. En el próximo módulo, profundizaremos en los módulos y la importación/exportación de código, lo que nos permitirá organizar mejor nuestros proyectos JavaScript.

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