Knockout.js
Тип | |
---|---|
Автор |
[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"
Примечания
- ↑ [github.com/knockout/knockout/releases/tag/v3.4.0 Последний релиз]
- ↑ [blog.stevensanderson.com/2010/11/03/hello-microsoft/ Steven Sanderson's blog post 'Hello, Microsoft']. blog.stevensanderson.com (November 3, 2010). Проверено 22 октября 2014.
- ↑ [trends.builtwith.com/javascript/KnockoutJS Статистика использования Knockout.js на вебсайтах] (англ.).
- ↑ [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
– Хороша у вас эта сучка! – сказал он небрежным тоном. – Резва?– Эта? Да, эта – добрая собака, ловит, – равнодушным голосом сказал Илагин про свою краснопегую Ерзу, за которую он год тому назад отдал соседу три семьи дворовых. – Так и у вас, граф, умолотом не хвалятся? – продолжал он начатый разговор. И считая учтивым отплатить молодому графу тем же, Илагин осмотрел его собак и выбрал Милку, бросившуюся ему в глаза своей шириной.
– Хороша у вас эта чернопегая – ладна! – сказал он.
– Да, ничего, скачет, – отвечал Николай. «Вот только бы побежал в поле матёрый русак, я бы тебе показал, какая эта собака!» подумал он, и обернувшись к стремянному сказал, что он дает рубль тому, кто подозрит, т. е. найдет лежачего зайца.
– Я не понимаю, – продолжал Илагин, – как другие охотники завистливы на зверя и на собак. Я вам скажу про себя, граф. Меня веселит, знаете, проехаться; вот съедешься с такой компанией… уже чего же лучше (он снял опять свой бобровый картуз перед Наташей); а это, чтобы шкуры считать, сколько привез – мне всё равно!
– Ну да.
– Или чтоб мне обидно было, что чужая собака поймает, а не моя – мне только бы полюбоваться на травлю, не так ли, граф? Потом я сужу…
– Ату – его, – послышался в это время протяжный крик одного из остановившихся борзятников. Он стоял на полубугре жнивья, подняв арапник, и еще раз повторил протяжно: – А – ту – его! (Звук этот и поднятый арапник означали то, что он видит перед собой лежащего зайца.)
– А, подозрил, кажется, – сказал небрежно Илагин. – Что же, потравим, граф!
– Да, подъехать надо… да – что ж, вместе? – отвечал Николай, вглядываясь в Ерзу и в красного Ругая дядюшки, в двух своих соперников, с которыми еще ни разу ему не удалось поровнять своих собак. «Ну что как с ушей оборвут мою Милку!» думал он, рядом с дядюшкой и Илагиным подвигаясь к зайцу.
– Матёрый? – спрашивал Илагин, подвигаясь к подозрившему охотнику, и не без волнения оглядываясь и подсвистывая Ерзу…
– А вы, Михаил Никанорыч? – обратился он к дядюшке.
Дядюшка ехал насупившись.
– Что мне соваться, ведь ваши – чистое дело марш! – по деревне за собаку плачены, ваши тысячные. Вы померяйте своих, а я посмотрю!
– Ругай! На, на, – крикнул он. – Ругаюшка! – прибавил он, невольно этим уменьшительным выражая свою нежность и надежду, возлагаемую на этого красного кобеля. Наташа видела и чувствовала скрываемое этими двумя стариками и ее братом волнение и сама волновалась.
Охотник на полугорке стоял с поднятым арапником, господа шагом подъезжали к нему; гончие, шедшие на самом горизонте, заворачивали прочь от зайца; охотники, не господа, тоже отъезжали. Всё двигалось медленно и степенно.
– Куда головой лежит? – спросил Николай, подъезжая шагов на сто к подозрившему охотнику. Но не успел еще охотник отвечать, как русак, чуя мороз к завтрашнему утру, не вылежал и вскочил. Стая гончих на смычках, с ревом, понеслась под гору за зайцем; со всех сторон борзые, не бывшие на сворах, бросились на гончих и к зайцу. Все эти медленно двигавшиеся охотники выжлятники с криком: стой! сбивая собак, борзятники с криком: ату! направляя собак – поскакали по полю. Спокойный Илагин, Николай, Наташа и дядюшка летели, сами не зная как и куда, видя только собак и зайца, и боясь только потерять хоть на мгновение из вида ход травли. Заяц попался матёрый и резвый. Вскочив, он не тотчас же поскакал, а повел ушами, прислушиваясь к крику и топоту, раздавшемуся вдруг со всех сторон. Он прыгнул раз десять не быстро, подпуская к себе собак, и наконец, выбрав направление и поняв опасность, приложил уши и понесся во все ноги. Он лежал на жнивьях, но впереди были зеленя, по которым было топко. Две собаки подозрившего охотника, бывшие ближе всех, первые воззрились и заложились за зайцем; но еще далеко не подвинулись к нему, как из за них вылетела Илагинская краснопегая Ерза, приблизилась на собаку расстояния, с страшной быстротой наддала, нацелившись на хвост зайца и думая, что она схватила его, покатилась кубарем. Заяц выгнул спину и наддал еще шибче. Из за Ерзы вынеслась широкозадая, чернопегая Милка и быстро стала спеть к зайцу.