📇 Proyecto: Lista de Contactos

Este proyecto te guiará en la creación de una aplicación para gestionar tus contactos, aplicando los principios de la Programación Orientada a Objetos (POO) en JavaScript. El enfoque principal está en el modelado de clases y el uso de estructuras de datos para organizar la información de forma eficiente. La interfaz gráfica es opcional, ya que el objetivo principal es dominar los conceptos de POO y estructuras de datos.

🎯 Objetivo general

Diseñarás una aplicación web que te permitirá registrar, visualizar y gestionar contactos mediante la aplicación de conceptos de Programación Orientada a Objetos (POO) y estructuras de datos complejas. Este proyecto te permitirá crear clases, instanciar objetos y trabajar con propiedades privadas, métodos personalizados,

getters y setters, y listas dinámicas de contactos.

🧠 Conceptos clave antes de empezar

• 
  

  POO: Paradigma de programación que organiza el código en torno a objetos.

  
  
• 
  

  Clases y Objetos: Una clase es un molde o plantilla para crear objetos, que son instancias de esa clase.

  
  

• Encapsulamiento: Principio que restringe el acceso directo a algunas propiedades del objeto. Se logra con propiedades privadas (

  #) y se maneja el acceso a través de métodos públicos (getters y setters).

  
  
• 
  

  Arreglos de objetos: Estructura de datos que almacena múltiples objetos, ideal para gestionar una colección de contactos.

  
  
• 
  

  Métodos de arreglo: Funciones integradas de JavaScript como push(), find(), filter(), y forEach() para manipular arreglos de forma eficiente.

  
  

🧪 Desarrollo paso a paso

Paso 1 – Estructura de clases

El primer paso es modelar las entidades principales de nuestro sistema.

1. Crea la clase Contacto: Esta clase servirá como plantilla para cada contacto.

   • Define un constructor que acepte nombre, telefono y correo.

   • Utiliza

     propiedades privadas para el nombre, telefono y correo (ej: #nombre, #telefono, #correo). Esto asegura que solo se puedan modificar a través de métodos definidos en la clase.

   
   

JavaScript

2. Crea la clase Directorio: Esta clase se encargará de gestionar toda la colección de contactos.

   • Define un constructor que inicialice un arreglo vacío para almacenar los contactos (ej: this.contactos = []).

JavaScript

Paso 2 – Métodos y lógica principal

Ahora, vamos a dotar a nuestras clases de funcionalidad.

1. Métodos en la clase Contacto:

   • Crea un método mostrarInformacion() que devuelva una cadena de texto con los detalles del contacto.

   • Puedes incluir métodos para editar la información del contacto, como editarTelefono(nuevoTelefono).

2. Métodos en la clase Directorio:

   • Crea un método

     agregarContacto(contacto) que use push() para añadir una nueva instancia de Contacto al arreglo this.contactos.

     
     

   • Crea un método

     buscarPorNombre(nombre) que use find() para buscar y devolver un contacto por su nombre.

     
     

   • Crea un método eliminarContacto(nombre) que encuentre el contacto y lo elimine del arreglo usando, por ejemplo, splice().

   • Crea un método

     mostrarDirectorio() que use forEach() para iterar sobre el arreglo y mostrar la información de cada contacto.

     
     

Paso 3 – Implementación de getters y setters 

Los

getters y setters nos permiten controlar cómo se accede y se modifica una propiedad privada.

1. En la clase

   Contacto, implementa getters para las propiedades privadas (#nombre, #telefono, #correo).

   
   

2. Implementa setters para las propiedades que puedan cambiar (#telefono, #correo), incluyendo una validación para asegurarte de que los nuevos valores sean válidos.

JavaScript

Paso 4 – Funcionalidades de manipulación de datos

En tu archivo principal de JavaScript, instancia las clases y usa los métodos que creaste.

1. Instancia la clase Directorio: const miDirectorio = new Directorio();.

2. Crea instancias de Contacto: const contacto1 = new Contacto("Juan Pérez", "123456789", "juan.perez@email.com");.

3. Agrega los contactos al directorio: miDirectorio.agregarContacto(contacto1);.

4. Usa los métodos de búsqueda y visualización:

   • miDirectorio.mostrarDirectorio();.

   • const contactoEncontrado = miDirectorio.buscarPorNombre("Juan Pérez");.

   • contactoEncontrado.telefono = "987654321"; (Usa el setter para probar la validación).

Paso 5 – Pruebas y presentación

Verifica que el código funcione como se espera.

• Asegúrate de que los contactos se añadan correctamente al directorio.

• Confirma que los métodos de búsqueda (find, filter) devuelvan los resultados correctos.

• Prueba los setters de la clase Contacto con valores no válidos para ver si la validación funciona.

• Explica cómo la POO hizo que el código fuera más organizado y fácil de mantener.

✅ Criterios de logro

• Estructura de clases clara y lógica.

  
  

• Uso correcto del

  encapsulamiento (# y this).

  
  

• Implementación de

  getters y setters para controlar el acceso a las propiedades.

  
  

• Utilización eficiente de

  métodos de arreglo (push, find, filter, forEach, splice).

  
  

• Código bien organizado y con comentarios explicativos.

• Todas las funcionalidades básicas (agregar, buscar, mostrar, eliminar) operan sin errores.

(Blog hecho por Frank Iglesias)