Asignatura Datos del alumno Fecha

Ambientes de Apellidos: Sotelo Suástegui

Programación 05 de febrero de 2023
Avanzada 2023-2 Nombre: Salomón

Unidad de Aprendizaje 4: Actividad Integradora U4.

Introducción a los patrones de diseño.

Los patrones de diseño o design patterns, son una solución general, reutilizable y aplicable a
diferentes problemas de diseño de software. Se trata de plantillas que identifican problemas
en el sistema y proporcionan soluciones apropiadas a problemas generales a los que se han
enfrentado los desarrolladores durante un largo periodo de tiempo, a través de prueba y error.
(1 Martínez Canelo, 2020).

Según Cristopher Alexander, “cada patrón describe un problema que ocurre una y otra vez en
nuestro entorno, así como la solución a ese problema, de tal modo que se pueda aplicar esta
solución un millón de veces, sin hacer lo mismo dos veces”. (2. Gamma et al., 1995).

En general un patrón tiene cuatro elementos esenciales:

1. El nombre del patrón permite describir, en una o dos palabras, un problema de diseño
junto con sus soluciones y consecuencias.
2. El problema describe cuándo aplicar el patrón. Explica el problema y su contexto.
3. La solución describe los elementos que constituyen el diseño, sus relaciones,
responsabilidades y colaboraciones.
4. Las consecuencias son los resultados, así como las ventajes e inconvenientes de aplicar el
patrón.

Descripción del patrón MVC: diagramas de clases y diagramas de interacción con la

descripción de sus participantes.

MVC es un patrón de diseño de software, este describe la separación de un sistema de

software en tres elementos:

Modelo: maneja los datos de una aplicación, se puede decir que el modelo es la parte central
de una aplicación MVC, el desarrollo del modelo se encuentra entre los primeros pasos de
cualquier proyecto de software MVC.

Vista: describe la representación visual de los datos y sus elementos de control (inputs box,
text box, buttons, check boxes, menus, etc.) para los usuarios. Una vista también puede usar
diferentes tecnologías, como un componente GUI instalado en la PC del usuario (GTK, QT,
ETC.), una aplicación en un teléfono móvil o una página web para ver en un navegador.

Controlador: Maneja la entrada del usuario y prepara el conjunto de datos necesario para que
la parte de la vista haga su trabajo. Si bien una vista muestra elementos del modelo, la vista
nunca tiene que saber cómo se almacenan y recuperan los datos de algún almacenamiento
persistente (base de datos). Esta es responsabilidad del controlador. Debido a que la entrada
del usuario determina qué debe hacer una aplicación a continuación, el controlador también
contiene la lógica de la aplicación. Cualquier cálculo y transformación de datos ocurre en la
parte de control de MVC.
 Asignatura Datos del alumno Fecha
Ambientes de Apellidos: Sotelo Suástegui
Programación 05 de febrero de 2023
Avanzada 2023-2 Nombre: Salomón

Para Java MVC, podemos limitar nuestras ideas sobre MVC a lo siguiente: un modelo
(almacenado en la memoria) define el estado de la aplicación; una vista muestra los valores del
modelo y envía las interacciones del usuario a un controlador; y el controlador prepara los
datos del modelo, maneja la entrada del usuario y, en consecuencia, cambia los valores del
modelo, y luego decide qué página de vista mostrar a continuación. Este tipo de modelo MVC
se muestra en la Figura 1.

Una implementación orientada a objetos de MVC definiría una clase separada para cada
componente. En una implementación de C++, las clases de vista y controlador comparten un
padre común que define la interfaz de actualización. Esto se muestra en la siguiente Figura 2.
 Asignatura Datos del alumno Fecha
Ambientes de Apellidos: Sotelo Suástegui
Programación 05 de febrero de 2023
Avanzada 2023-2 Nombre: Salomón

Descripción del patrón MVP: diagramas de clases y diagramas de interacción con la

descripción de los participantes.

El patrón MVP es una variante del patrón MVC y se utiliza principalmente para el desarrollo de
interfaces de usuario para aplicaciones web. Fue diseñado principalmente para facilitar la
realización de pruebas unitarias automatizadas. La figura 3 que se proporciona aquí muestra la
arquitectura del patrón MVP: (Raj et al., 2017).

Los diversos componentes del patrón MVP son los siguientes:

Modelo: este componente especifica los datos que se mostrarán/enviarán desde o hacia la
interfaz de usuario.
 Asignatura Datos del alumno Fecha
Ambientes de Apellidos: Sotelo Suástegui
Programación 05 de febrero de 2023
Avanzada 2023-2 Nombre: Salomón

Vista: La lógica de presentación se encuentra en el componente Presentador. Actúa tanto en el

modelo como en los componentes de la vista. Es responsable de obtener datos del modelo,
aplicar la lógica adecuada y devolverlos para mostrarlos en la vista. En comparación con los
componentes de vista y controlador en el modelo MVC, los componentes de vista y
presentador presentes en el patrón MVP están completamente desacoplados entre sí y se
comunican por medio de una interfaz.

Presentador: el componente de vista solo actúa como una interfaz pasiva. Muestra datos del
modelo y envía entradas y comandos del usuario al componente presentador. Estas entradas y
comandos del usuario se utilizarán para realizar operaciones en los datos.

Las siguientes son algunas de las consideraciones clave sobre el patrón MVP:

 El usuario final interactúa solo con la Vista.

 Un componente Vista se asigna solo a un componente Presentador.
 El componente Vista referencia al componente Presentador, pero no tiene ninguna
referencia al componente Modelo.
 El patrón facilita la comunicación bidireccional entre el componente Vista y el
componente Presentador.

La figura 4 que se proporciona aquí, muestra el diagrama de clases del patrón MVP:

Cuadro comparativo de los patrones MVC y MVP acorde a un conjunto de rasgos

importantes seleccionados por el estudiante.

No hay muchas diferencias entre MVC y MVP. Ambos patrones se centran en separar la
responsabilidad entre múltiples componentes, por lo tanto, promueven un acoplamiento
flexible de la interfaz de usuario (vista) de la capa empresarial (modelo). (Difference Between
MVC and MVP Patterns, 2022).

Las principales diferencias comparativas se encuentran en su implementación, por ejemplo:

 Asignatura Datos del alumno Fecha
Ambientes de Apellidos: Sotelo Suástegui
Programación 05 de febrero de 2023
Avanzada 2023-2 Nombre: Salomón

 Acoplamiento: la vista y el modelo están estrechamente acoplados en MVC pero

débilmente acoplados en MVP.

 Comunicación: en MVP, la comunicación entre View-Presenter y Presenter-Model se

realiza a través de una interfaz. Sin embargo, el controlador y la capa de vista caen en
la misma actividad/fragmento en MVC.

 Entrada del usuario: en MVC, las entradas del usuario son manejadas por el
controlador que instruye al modelo para más operaciones. Pero en MVP, las entradas
del usuario son manejadas por la vista que le indica al presentador que llame a las
funciones apropiadas.

 Tipo de relación: existe una relación de muchos a uno entre el controlador y la vista.
Un controlador puede seleccionar diferentes vistas según las operaciones requeridas
en MVC. Por otro lado, el presentador y la vista tienen una relación de uno a uno en
MVP, donde una clase de presentador administra una vista a la vez.

 Componente principal: en MVC, el controlador está a cargo. Crea la vista adecuada e

interactúa con el modelo de acuerdo con la solicitud del usuario. Por el contrario, en
MVP, la vista manda. Los métodos de llamada de vista en el presentador, que dirige
aún más el modelo.

 Pruebas unitarias: debido al estrecho acoplamiento, MVC tiene soporte limitado para
pruebas unitarias. Por otro lado, las pruebas unitarias están bien soportadas en MVP

Conclusiones.

Dependiendo de lo complejo de nuestra aplicación debemos de seleccionar el patrón de

diseño que más se acomode, por ejemplo, para una aplicación muy sencilla de no más de dos
páginas la mejor opción seria MVC, mientras que MVP agraria mayor complejidad al
desarrollo, sin embargo, al final todo se traduce a la pericia o preferencia del desarrollador.
Pero algo que si es seguro es que ambos patrones de diseño ayudan a asegurar que el
desarrollo de nuestro sistema está basado en herramientas probadas que aseguran a tener
menos errores el despliegue de nuestra aplicación.

Referencias

1. Martínez Canelo, M. (24 de junio de 2020). Qué son los Patrones de Diseño de software /
Design Patterns. Recuperado de https://profile.es/blog/patrones-de-diseno-de-software/
2. Gamma, E., Johnson, R. E., Helm, R., Johnson, R. E., Vlissides, J., Erich Gamma, R. H. R. J. J. V.,
& Booch, G. (1995). Design Patterns: Elements of Reusable Object-Oriented Software. Addison-
Wesley.
3. Späth, P. (2021). About MVC: Model, View, Controller. In: Beginning Java MVC 1.0. Apress,
Berkeley, CA.
4. Buschmann, F., Schmidt, D. C., Regine Meunier, Rohnert, H., Stal, M., Sommerlad, P., &
Meunier, R. (1996). Pattern-Oriented Software Architecture, A System of Patterns. Wiley.
 Asignatura Datos del alumno Fecha
Ambientes de Apellidos: Sotelo Suástegui
Programación 05 de febrero de 2023
Avanzada 2023-2 Nombre: Salomón

5. Patrón Modelo Vista Controlador | Marco de Desarrollo de la Junta de Andalucía. (s. f.).
www.juntadeandalucia.es. Recuperado 6 de febrero de 2023, de
https://www.juntadeandalucia.es/servicios/madeja/contenido/recurso/122
6. Raj, P., Raman, A., & Subramanian, H. (2017). Architectural Patterns. Packt Publishing.
7. Difference Between MVC and MVP Patterns. (2022, 9 noviembre). www.baeldung.com.
Recuperado 6 de febrero de 2023, de https://www.baeldung.com/mvc-vs-mvp-pattern
8. GeeksforGeeks. (2020, 10 noviembre). Difference Between MVC and MVP Architecture
Pattern in Android. Recuperado 6 de febrero de 2023, de
https://www.geeksforgeeks.org/difference-between-mvc-and-mvp-architecture-pattern-in-
android/
9. Dang, A. T. (2021, 16 diciembre). MVC vs MVP vs MVVM - Level Up Coding. Medium.
https://levelup.gitconnected.com/mvc-vs-mvp-vs-mvvm-35e0d4b933b4
10. Tsen, V. (2023, 8 enero). MVC vs MVP vs MVVM Design Patterns. DEV Community.
https://dev.to/vtsen/mvc-vs-mvp-vs-mvvm-design-patterns-443n