Knockout.js/computed関数
ナビゲーションに移動
検索に移動
knockout.jsのcomputed関数(computedオブジェクト)とは、セッターで設定された関数内で使われているobservableオブジェクトがひとつでも更新されると、自動的に計算をおこない、まるでobservableオブジェクトと同じように振る舞う監視関数(オブジェクト)である。
記述例
この例は、observableオブジェクトである firstName または lastName のどちらかが更新されると、fullNameも自動的に更新されるというものである。
var AppViewModel = function() {
var self = this;
self.firstName = ko.observable('mono');
self.lastName = ko.observable('mono');
// firstNameまたはlastNameが更新されると自動的に
// fullNameも更新される。
self.fullName = ko.computed(function() {
return self.firstName() + " " + self.lastName();
});
};
computed関数は、ビュー(HTML)での各種バインディングでobservableオブジェクトと同じよう扱える。
私の名前は<span data-bind="text: fullName"></span>です。
なお、この例においてAppViewModelオブジェクト内でthis変数をself変数に代入している意味について謎な人は「JavaScript/this」や「クロージャー」、「高階関数」など項目を参照。JavaScriptやPythonに精通している人には説明不要だろうが、C#やJavaしか知らない人は「this」の扱いに特に注意する必要がある。