Knockout.js/observable関数

knockout.jsのobservable関数（observableオブジェクト）とは、knockout.jsがビューモデルの変更を検出するためにもちいる監視オブジェクトである。

なお、JavaScriptでのオブジェクトの実体は関数なので、クラスベースのオブジェクト指向に慣れている人には気持ち悪い記述かもしれないが、慣れろ。

目次

セッターメソッド

observableオブジェクトに値を設定するには、引数に値をセットして呼び出す。 いわゆるセッターメソッドに相当する。

var AppViewModel = function() {
  var name = ko.observable("knockoutjsさん"); // これ
};

なお、このセッターメソッドの戻り値は、自らのobservableオブジェクトなのでメソッドチェーン的な書き方もできる。

// こういう記述は
myViewModel.name("jqueryさん");
myViewModel.age(6);
// こういう風にも書ける。
myViewModel.name("jqueryさん").age(6);
// 誰得。

ゲッターメソッド

observableオブジェクトが保持している値を取得するには、引数をつけずに呼び出す。 いわゆるゲッターメソッドに相当する。

var AppViewModel = function() {
  var name = ko.observable("knockoutjsさん");
};
var myViewModel = new AppViewModel();

// これ
// 括弧が必要な点に注意すること。
var hogehogehoge = myViewModel.name();

備考

なお、本来のJavaScriptではC#のプロパティ構文とほぼ同じアクセサメソッドが用意されており（get構文およびset構文）、本来であればもっと簡潔明瞭に書けるはずだったが、一部のクソブラウザ（IE8とかIE8とかIE8、なおIE9には付いたらしいよ）がゲッターとセッターをサポートしていないクソ仕様なせいでこのような書式になったそうだ。

関連項目

• knockout.js
  • applyBindings関数
  • observable関数（observableオブジェクト）
  • observableArray関数（observableArrayオブジェクト）
  • computed関数
  • subscribe関数