Knockout.js の履歴(No.3)

更新

Knockout.js†

ブラウザ上の DOM を JavaScript で操作するために、 JavaScript 上の ViewModel オブジェクトと DOM とをリンクさせ、ViewModel の変更が自動的に DOM に反映されるようになる超お手軽なライブラリ

非常に使いやすいテンプレート機能や、 Computed Observable によるデータ依存関係の追跡も、地味に重要な機能

と理解しました。

最近は prototype.js ははやらないので、

あたりを使うのが定番なのでしょうか？

未稿

このあたりのコードを見ていると、まだまだ枯れたライブラリとは言えないようで、自己責任で使っていくしかない感じがひしひしと。

ここでの親子は継承関係ではなくてコンポジット関係。

あと、恐らく knockout.validation の問題かも。

子オブジェクトが親オブジェクトへのリンクを持っていると、 ko の依存関係の検出時に無限ループしてしまうみたいです。

// これはダメ

Child = function(parent) {
  this.parent = parent;
};

Parent = function() {
  this.child = new Child(this);
};

Parent 依存している Child が依存している Parent が依存している Child が・・・

と追っていってブラウザが固まります（泣

どうしても Child に Parent へのリンクを持たせたいときは、関数にすれば回避できるようです。

// これならＯＫ

Child = function(parent) {
  this.parent = function(){ return parent; };
};

Parent = function() {
  this.child = new Child(this);
};

子オブジェクトが親オブジェクトを知っていなければならないという時点で設計がおかしいという指摘もあるかと思いますが、全体の調和を見るような Validation を実装しようとすると親へのリンクが欲しくなる場合があるような？

もっと良い回避方法があるのかもしれないですが、とりあえずメモということで。

knockout.validation の traverse がものすごく時間がかかる。

理由を調査中。

knockout の UI を強制的に refresh するには、

observable.valueHasMutated();

を呼べばいいそうです。

普通はそういうことは起きないはずなんですが、 ObservableArray.sort と select の組み合わせで select の表示がおかしくなり、それを正しく戻すために .valueHasMutated() が必要でした。(knockout-3.0.0.js)

Counter: 5313 (from 2010/06/03), today: 1, yesterday: 2