*

【spine.js】Spine.jsを使ってはまったポイント

公開日: : 最終更新日:2014/03/21 spine.js

Spine.jsでクラスの継承をさせようとしていくつかはまってしましました。

※CoffeScriptではなくJavaScriptのみ使用しています

◯親クラスへの参照
少し長いですが、以下でアクセス可能です。
this.constructor.__super_

◯親クラスのプロパティを更新する
子クラス内で、親クラスのプロパティを更新すると、継承関係を持つ子クラス全てに影響します。
つまり、子クラスは根っこのほうで同じプロパティを参照していることになり、普通の(私の母国語はJavaです)クラス設計が成り立たなくなります。

これはステートフルJavaScript ―MVCアーキテクチャに基づくWebアプリケーションの状態管理 ” target=”_blank”>Spine.js作者の著書を読み直して気が付きました。公式ドキュメントではこれについて触れられていません。

私は定数やメソッドなど更新する必要のないプロパティのみ継承するか、has-a関係、つまり継承ではなく流用したい機能を持ったクラスをインスタンス化して内部で保持するようにしています。

◯モデルの継承
下記のようなモデルを継承します。

var VideoEntryModel = Spine.Model.sub();
VideoEntryModel.configure(
	"VideoEntryModel",
	"videoId", 
	"videoTitle",
	);

var SearchModel = VideoEntryModel.sub();
var RelatedModel = VideoEntryModel.sub();

上記の記述でSearchModelやRelatedModelを使用すると、全てVideoEntryModelを対象として処理が行われます。

configure()の第一引数はモデル名を指定します。
モデルを使用する際は、第一引数で指定した文字列が操作対象のモデル識別子となります。
そのため、継承して新たなクラスとしてモデルを定義してもconfigure()で自分のモデル名を指定しないと正しく処理が行われません。

var SearchModel = VideoEntryModel.sub();
SearchModel.configure("SearchModel");

親クラスで指定したその他のプロパティが上書かれてしまいそうですが、上記のように書くとモデル名だけ変更することができました。
上記の方法は同じ構成のデータを違うグループとして管理したい場合に有効です。

◯コントローラの継承

関連記事

no image

【spine.js】Spine.jsの基本 ~クラスの操作~

このエントリでprivateなプロパティを宣言してクラスみたいなことをやっていたのだけれど、これだけ

記事を読む

no image

【spine.js】Spineのドキュメント翻訳 Controllers

元記事はこちら はじめに controllerはSpineの三位一体の最後の1つ

記事を読む

no image

【spine.js】Spineのドキュメント翻訳 Views & Templating using jQuery.tmpl

javascriptのテンプレートエンジンは他にMustacheというのが有力そうです。強みは様々な

記事を読む

no image

【spine.js】Spineの使い方

Spine.jsを使ってみようということで基本となる使い方をメモ。 詳しい話はAPIがあるしチュー

記事を読む

no image

【spine.js】Spineのドキュメント翻訳 Models

元のドキュメントはこちら はじめに 状態が変化する中、クライアントサイドで実現したい

記事を読む

no image

【spine.js】Spineのドキュメント翻訳 Routing

元のドキュメントはこちら ↓↓↓ Routing - Documentation - Spi

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

no image
知らないと損をする6つのライセンスまとめ

オープンソースやフリーウェア、フリー素材などが巷に溢れ、それらを利用す

no image
ガリレオ:ニュースブラウザをリリースしました。

概要 ガリレオはニュースを読んだり、検索する機能に特化したブラウザア

no image
【android】Activityとプロセスのライフサイクル

またもやライフサイクル周りでハマったのですが、Androidのライフサ

→もっと見る

PAGE TOP ↑