Knockout.js

Поделись знанием:
Перейти к: навигация, поиск
Knockout.js
Тип

JavaScript-библиотека

Автор

[blog.stevensanderson.com Steve Sanderson]

Последняя версия

3.4.0[1] (17 ноября 2015)

К:Википедия:Статьи без изображений (тип: не указан)

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

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

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

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





Особенности

  • Декларативное связывание
  • Автоматическое обновление интерфейса при изменении состояния данных модели
  • Отслеживание зависимостей
  • Прототипирование с использованием как собственных так и сторонних механизмов (например, 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());

Напишите отзыв о статье "Knockout.js"

Примечания

  1. [github.com/knockout/knockout/releases/tag/v3.4.0 Последний релиз]
  2. [blog.stevensanderson.com/2010/11/03/hello-microsoft/ Steven Sanderson's blog post 'Hello, Microsoft']. blog.stevensanderson.com (November 3, 2010). Проверено 22 октября 2014.
  3. [trends.builtwith.com/javascript/KnockoutJS Статистика использования Knockout.js на вебсайтах] (англ.).
  4. [trends.builtwith.com/websitelist/KnockoutJS Использование Knockout.js на вебсайтах] (англ.).

Литература

  • 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.

Ссылки

  • [knockoutjs.com tjs.com] — официальный сайт Knockout.js
  • [knockoutmvc.com/ Knockout MVC: A framework integrating KnockoutJS into ASP.NET] (англ.)
  • [channel9.msdn.com/Events/MIX/MIX11/FRM08 Knockout JS: Helping you build dynamic JavaScript UIs with MVVM and ASP.NET] (англ.)
  • [blog.davidpadbury.com/2011/03/20/using-isotope-with-knockout-js/ Using Isotope with Knockout.js] (англ.)
  • [www.knockmeout.net/ Примеры Knockout.js] (англ.)

См. также

Отрывок, характеризующий Knockout.js

– Хороша у вас эта сучка! – сказал он небрежным тоном. – Резва?
– Эта? Да, эта – добрая собака, ловит, – равнодушным голосом сказал Илагин про свою краснопегую Ерзу, за которую он год тому назад отдал соседу три семьи дворовых. – Так и у вас, граф, умолотом не хвалятся? – продолжал он начатый разговор. И считая учтивым отплатить молодому графу тем же, Илагин осмотрел его собак и выбрал Милку, бросившуюся ему в глаза своей шириной.
– Хороша у вас эта чернопегая – ладна! – сказал он.
– Да, ничего, скачет, – отвечал Николай. «Вот только бы побежал в поле матёрый русак, я бы тебе показал, какая эта собака!» подумал он, и обернувшись к стремянному сказал, что он дает рубль тому, кто подозрит, т. е. найдет лежачего зайца.
– Я не понимаю, – продолжал Илагин, – как другие охотники завистливы на зверя и на собак. Я вам скажу про себя, граф. Меня веселит, знаете, проехаться; вот съедешься с такой компанией… уже чего же лучше (он снял опять свой бобровый картуз перед Наташей); а это, чтобы шкуры считать, сколько привез – мне всё равно!
– Ну да.
– Или чтоб мне обидно было, что чужая собака поймает, а не моя – мне только бы полюбоваться на травлю, не так ли, граф? Потом я сужу…
– Ату – его, – послышался в это время протяжный крик одного из остановившихся борзятников. Он стоял на полубугре жнивья, подняв арапник, и еще раз повторил протяжно: – А – ту – его! (Звук этот и поднятый арапник означали то, что он видит перед собой лежащего зайца.)
– А, подозрил, кажется, – сказал небрежно Илагин. – Что же, потравим, граф!
– Да, подъехать надо… да – что ж, вместе? – отвечал Николай, вглядываясь в Ерзу и в красного Ругая дядюшки, в двух своих соперников, с которыми еще ни разу ему не удалось поровнять своих собак. «Ну что как с ушей оборвут мою Милку!» думал он, рядом с дядюшкой и Илагиным подвигаясь к зайцу.
– Матёрый? – спрашивал Илагин, подвигаясь к подозрившему охотнику, и не без волнения оглядываясь и подсвистывая Ерзу…
– А вы, Михаил Никанорыч? – обратился он к дядюшке.
Дядюшка ехал насупившись.
– Что мне соваться, ведь ваши – чистое дело марш! – по деревне за собаку плачены, ваши тысячные. Вы померяйте своих, а я посмотрю!
– Ругай! На, на, – крикнул он. – Ругаюшка! – прибавил он, невольно этим уменьшительным выражая свою нежность и надежду, возлагаемую на этого красного кобеля. Наташа видела и чувствовала скрываемое этими двумя стариками и ее братом волнение и сама волновалась.
Охотник на полугорке стоял с поднятым арапником, господа шагом подъезжали к нему; гончие, шедшие на самом горизонте, заворачивали прочь от зайца; охотники, не господа, тоже отъезжали. Всё двигалось медленно и степенно.
– Куда головой лежит? – спросил Николай, подъезжая шагов на сто к подозрившему охотнику. Но не успел еще охотник отвечать, как русак, чуя мороз к завтрашнему утру, не вылежал и вскочил. Стая гончих на смычках, с ревом, понеслась под гору за зайцем; со всех сторон борзые, не бывшие на сворах, бросились на гончих и к зайцу. Все эти медленно двигавшиеся охотники выжлятники с криком: стой! сбивая собак, борзятники с криком: ату! направляя собак – поскакали по полю. Спокойный Илагин, Николай, Наташа и дядюшка летели, сами не зная как и куда, видя только собак и зайца, и боясь только потерять хоть на мгновение из вида ход травли. Заяц попался матёрый и резвый. Вскочив, он не тотчас же поскакал, а повел ушами, прислушиваясь к крику и топоту, раздавшемуся вдруг со всех сторон. Он прыгнул раз десять не быстро, подпуская к себе собак, и наконец, выбрав направление и поняв опасность, приложил уши и понесся во все ноги. Он лежал на жнивьях, но впереди были зеленя, по которым было топко. Две собаки подозрившего охотника, бывшие ближе всех, первые воззрились и заложились за зайцем; но еще далеко не подвинулись к нему, как из за них вылетела Илагинская краснопегая Ерза, приблизилась на собаку расстояния, с страшной быстротой наддала, нацелившись на хвост зайца и думая, что она схватила его, покатилась кубарем. Заяц выгнул спину и наддал еще шибче. Из за Ерзы вынеслась широкозадая, чернопегая Милка и быстро стала спеть к зайцу.