Knockout (web framework)

Knockout is a standalone JavaScript implementation of the Model-View-ViewModel pattern with templates. The underlying principles are therefore:

  • a clear separation between domain data, view components and data to be displayed
  • the presence of a clearly defined layer of specialized code to manage the relationships between the view components
Knockout
Original author(s)Steve Sanderson
Initial releaseJuly 5, 2010 (2010-07-05)
Stable release
3.5.1 / November 5, 2019 (2019-11-05)
RepositoryKnockout Repository
Written inJavaScript
Size59 KB minified / 283 KB (development mode)
TypeJavaScript library
LicenseMIT
Websiteknockoutjs.com

The latter leverages the native event management features of the JavaScript language.

These features streamline and simplify the specification of complex relationships between view components, which in turn make the display more responsive and the user experience richer.

Knockout was developed and is maintained as an open source project by Steve Sanderson.

Features

Knockout includes the following features:

  • Declarative bindings
  • Automatic UI refresh (when the data model's state changes, the UI updates automatically)
  • Dependency tracking Templating (using a native template engine although other templating engines can be used, such as jquery.tmpl)

Example

In this example, two text boxes are bound to observable variables on a data model. The "full name" display is bound to a dependent observable, whose value is computed in terms of the observables. When either text box is edited, the "full name" display is automatically updated, with no explicit event handling.

View Model (JavaScript)

 
function ViewModel() {
    this.firstName = ko.observable("");
    this.lastName = ko.observable("");

    this.fullName = ko.computed(
        function() { return this.firstName() + " " + this.lastName(); }, 
        this);
}

ko.applyBindings(new ViewModel());
gollark: The transistor switches the inductor between being connected to the voltage source's other end and being connected to it only through the diode and capacitor and resistor and such. The inductor "wants" to keep the current through it constant. When it's connected to the other end of the voltage source, it's "charging", and when it is disconnected there is a voltage across it slightly bigger than the voltage source's voltage, which causes a current through the left side of the circuit.
gollark: I could also use pronouns, but then I would have to mention HTech™ at least once to make it clear.
gollark: This is generally how language works.
gollark: I was talking about HTech™, so I said HTech™.
gollark: No.

References
    • Papa, John (February 2012). "Getting Started with Knockout". MSDN Magazine. Retrieved March 9, 2012.
    • Papa, John (March 2012). "Knockout's Built-in Bindings for HTML and JavaScript". MSDN Magazine. Retrieved March 9, 2012.
    This article is issued from Wikipedia. The text is licensed under Creative Commons - Attribution - Sharealike. Additional terms may apply for the media files.