[Aplicado] Construye una lista de tareas sencilla

En esta lección combinarás los arrays, objetos, funciones, bucles y clases que has aprendido para construir una sencilla herramienta de gestión de tareas, afianzando tu comprensión global. Está dirigida a quien ha buscado «cómo hacer una app de tareas en JavaScript».

Combinemos arrays, objetos, funciones, bucles y clases, todo lo aprendido hasta aquí, para construir una sencilla herramienta de tareas pendientes. En el desarrollo real también se construye lo grande combinando piezas pequeñas como estas. Es una lección de cierre en la que sentirás cómo el conocimiento de cada lección se aplica a una app real.

El código de ejemplo tiene una clase TodoList con una propiedad tasks que gestiona las tareas en un array, junto a tres métodos: add(), complete() y show(). Cada método combina de verdad operaciones que ya conoces: añadir a un array, cambiar la propiedad de un objeto y listar todo con .forEach().

Un tropiezo habitual al empezar es hacerse una imagen global de un código donde se entrelazan varias funcionalidades. Se entiende mejor si compruebas primero el comportamiento de cada método por separado —solo add(), luego solo complete()— antes de seguir cómo funcionan juntos. Cuando te sientas cómodo, prueba tus propias ampliaciones: una función de borrado, niveles de prioridad, etc.

Este ejemplo no usa pantalla (HTML): realiza «añadir una tarea», «completarla» y «mostrar la lista» solo con salidas por consola. Cuando te sientas con soltura, puedes evolucionarlo a una app de tareas real combinándolo con un <button> de HTML (merece la pena estudiar en paralelo las lecciones de HTML/CSS).