code prettify

Thursday 4 February 2016

MVVM pattern as applied to Javascript


MVVM stands for Model, View and ViewModel pattern.

Application: Used in knockout.js library.

Role of each part:

Model - Handles the application's persisted data that is the data which the view page receives through an ajax request from the server(GET or POST). It can also be used to store the data which is passed to the page when the page is loaded for the first time with some data content, to be used later on client(browser) side.

View - It simply represents the html content. Each View is associated with a ViewModel. View changes according to changes in ViewModel(It's next in list).

ViewModel - It is basically a model for the view. It is a code representation of the data and the supported operations on it. The ViewModel is not usually used as a persisted storage medium but is meant to hold dynamic data and handle related operations. It basically holds the unsaved changes the user is working with. The data can be saved by posting it back to server.

                     ViewModels in knockout.js are implemented by POJOs(Plain Old Javascript Objects). For instance, if you are dispaying a list of todo notes(View), then your ViewModel might hold a list of such note objects and expose several functions to modify/add notes. Display of notes changes according to changes made to notes ViewModel.

No comments:

Post a Comment