Share to: share facebook share twitter share wa share telegram print page

Knockout.js

Knockout.js
Тип библиотека JavaScript
Автор Steve Sanderson
Написана на JavaScript
Операционная система кроссплатформенность
Аппаратная платформа кроссплатформенность
Последняя версия
Репозиторий github.com/knockout/knoc…
Лицензия лицензия MIT
Сайт knockoutjs.com
knockoutjs.com

Knockout.js (англ. нокаут) — свободный JavaScript каркас веб-приложений, реализующий Model-View-ViewModel шаблон c образцами. Основными принципами являются:

  • чёткое разделение доменных данных, компонентов отображения и отображаемых данных
  • наличие чётко определённого слоя специализированного кода, задающего отношение компонентов отображения.

Автором библиотеки является сотрудник Microsoft, однако, по его словам библиотека останется такой, какой она является, и будет развиваться в направлении, определяемом лишь им самим и сообществом пользователей. Также он подчёркивает, что библиотека не является продуктом Microsoft[3].

На начало 2015 года библиотека была ранее использована на 17018 веб-сайтах, и продолжает использоваться на 29039 сайтах, в том числе на 55 из 10 тысяч наиболее популярных[4], например, на сайте компании Philips[5].

Особенности

  • Декларативное связывание
  • Автоматическое обновление интерфейса при изменении состояния данных модели
  • Отслеживание зависимостей
  • Прототипирование с использованием как собственных так и сторонних механизмов (например, jquery.tmpl)

Пример

В данном примере, два текстовых поля привязаны к отслеживаемым переменным в модели данных. В случае изменения их значений будет вызвана функция, меняющая значение fullName, что соответственно изменит значение в представлении (HTML).

View (HTML)

<p>First name: <input data-bind="value: firstName" /></p>
<p>Last name: <input data-bind="value: lastName" /></p>
<p>Full name: <strong data-bind="text: fullName"></strong></p>

View Model (JavaScript)

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

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

ko.applyBindings(new ViewModel());

См. также

Примечания

  1. Release 3.5.1 — 2019.
  2. npmjs
  3. Steven Sanderson's blog post 'Hello, Microsoft'. blog.stevensanderson.com (3 ноября 2010). Дата обращения: 22 октября 2014. Архивировано 20 ноября 2014 года.
  4. Статистика использования Knockout.js на веб-сайтах (англ.). Дата обращения: 17 января 2015. Архивировано 18 января 2015 года.
  5. Использование Knockout.js на веб-сайтах (англ.). Дата обращения: 17 января 2015. Архивировано 27 февраля 2015 года.

Литература

  • Munro, J. Knockout.js: Building Dynamic Client-Side Web Applications. — O'Reilly Media, 2014. — 102 p. — ISBN 9781491914328.
  • Munro, J. ASP. NET MVC 5 with Bootstrap and Knockout. Js: Building Dynamic, Responsive Web Applications. — O'Reilly Media, Incorporated, 2015. — 200 p. — ISBN 9781491914397.
  • Messora, R. Web App Testing Using Knockout.JS. — Packt Publishing Ltd, 2014. — 154 p. — ISBN 9781783982851.
  • Moran, T. Mastering KnockoutJS. — 2014. — 270 p. — ISBN 9781783981014.

Ссылки

Kembali kehalaman sebelumnya