In a JavaScript-implemented MVVM pattern, often the "Model" part is supplied by the web api. The data that is provided to the page is the model. Now whether that data is contained in an separate model object once it's in JavaScript - that's another story.
Often a View Model is just a Model that has been augmented with properties and functions to support the particular view that it is applied to. Client-side calculations, drop-down look-up values, client-side validation routines, etc. In this case, the view model might look like this:
var vm = {
save: function(){ save logic... },
cancel: function(){ cancel logic... },
states: ko.observable(), //list of states for state dropdown
customerId: ko.observable(),
customerFirstName: ko.observable(),
customerLastName: ko.observable()
};
Other times, the model will be maintained in a separate object. In that case the view model might look like this:
var customerModel = getCustomerFromDataSource();
var vm = {
save: function(){ save logic... },
cancel: function(){ cancel logic... },
states: ko.observable(), //list of states for state dropdown
customer: customerModel
};
The main thing to keep in mind is that the Model is the data and the View Model is the layer that makes your Model available to the view (usually via data-binding). Sometimes the Model may be a separate class; other times the Model is just a known set of properties in the View Model.