Hola aprendiendo JavaScript OOP, tengo algunas preguntas. Siguiendo algunos tutoriales en línea, creé un proyecto de lista de tareas pendientes usando DOM y un proyecto de lista de libros similar con el concepto OOP aprendido.

Son bastante similares en el sentido de que los usuarios ingresan valores en los campos de entrada y presionan el botón Enviar, luego los valores ingresados se agregarán como una fila en html.

Pero mi pregunta es por qué usamos OOP: creamos clases como listas de libros, clases de interfaz de usuario, ya que también crean cosas DOM. O la pregunta debería ser ¿qué beneficios tiene el uso de programación orientada a objetos para dicho proyecto?

A continuación se muestra el código para el proyecto de lista de libros

 // Book Constructor function Book(title, author, isbn) { this.title = title; this.author = author; this.isbn = isbn; } // UI Constructor function UI() { } // Add Book To List UI.prototype.addBookToList = function(book) { const list = document.getElementById('book-list'); // Create tr element const row = document.createElement('tr'); // Insert cols row.innerHTML = ` <td>${book.title}</td> <td>${book.author}</td> <td>${book.isbn}</td> <td><a href="#" class="delete">X</a></td> `; list.appendChild(row); } // Clear Fields UI.prototype.clearFields = function() { document.getElementById('title').value = ''; document.getElementById('author').value = ''; document.getElementById('isbn').value = ''; } // Event listeners document.getElementById('book-form').addEventListener('submit', (e) => { // Get form values const title = document.getElementById('title').value, author = document.getElementById('author').value, isbn = document.getElementById('isbn').value // Instantiate book const book = new Book(title, author, isbn); // Instantiate UI const ui = new UI(); // Add book to list ui.addBookToList(book); // Clear fields ui.clearFields(); e.preventDefault(); });