MVC en Vanilla JavaScript

Question

Ahora estoy en el punto en el que realmente quiero organizar mi código de una manera que lo haga más escalable y manejable. Quiero obtener una mejor comprensión de la arquitectura MVC en javascript sin utilizar un marco.

Así que esto es lo que entiendo hasta ahora (por favor, por favor, por favor, corríjanme si me equivoco):

Modelo: una estructura organizada de los sitios/aplicaciones web de contenido (fotos, copiar, descargable contenido, etc ...) que también tiene lógica necesaria en la manipulación del contenido. por lo que en javascript, el modelo podría ser un objeto JSON o una llamada a un archivo php que recupera/actualiza una base de datos y la lógica del modelo podría ser funciones responsables del análisis sintáctico, la expresión y la organización del contenido para que pueda ser entregado fuera de la vista?

Ver: la interfaz de usuario y la representación visual de los datos/contenidos del Modelo. su único trabajo es mostrar el contenido y aceptar la entrada del usuario si corresponde?

Controlador: ¿entonces el único trabajo del controlador es actuar como mediador entre el modelo y la vista? por ejemplo, si la vista necesita datos, ¿le pregunta al controlador quién va al modelo para obtener los datos y luego los envía a la vista? y si hay alguna entrada de usuario, la vista la envía al controlador, que luego la envía al modelo, que luego se actualiza; en ese momento, el controlador informa a la vista que el modelo se ha actualizado.

MVC ha sido y sigue siendo un punto de confusión para mí, combinado con el hecho de que se ha afirmado que MVC no es algo natural en javascript (al menos no como en php, java, actionscript, etc. .)

Answer 1

Mirar el código siempre ha sido la mejor manera de aprender, así que pensé que lo compartiría.

TODO mvc comparing many different JS MV* Frameworks

El enlace de arriba compara toda la mv JS * marcos. Esta demo particular que debe interesar,

Vanilla JS Todo mv* implementation

source

A partir de los sonidos de la misma a entender lo que MVC es y está confundido en cuanto a cómo implementarlo en JS, con tan sólo mirar en los muchos marcos diferentes que existen (ember.js, backbone.js, etc.) y su fuente para conocer su opinión. La lista de tareas pendientes es un gran punto de partida.

Answer 2

La primera verdad es que View y Controller están, en la mayoría de los casos, muy cerca. A veces, incluso lo mismo. Y eso no es necesariamente malo. Si tiene una tabla, seleccione una fila, luego haga clic en un botón que cambiará los datos en la fila seleccionada, obviamente el botón formará parte de la Vista (vea datos) y Controlador (usted cambia los datos). Hay mejores ejemplos de esto, estoy seguro ...

La segunda verdad es que va a encontrar casi tantos comentarios sobre MVC ya que hay personas;)

Pero, personalmente, te aconsejo no seguir un patrón de diseño servilmente.MVC es un buen punto de partida para diseñar su código, pero al final, su código debe ser rápido, estable y fácil de mantener. Y usted (y su equipo) deben sentirse cómodos con el código. Si terminas con un código que sigue el patrón MVC, bien. Si no, también está bien. Al menos esa es mi opinión sobre eso.