2010年5月8日土曜日

ExtJs-80 継承の書き方を決めてみる。(とうとう仕事でコードを書かなくなった)

とうとう仕事でコードを書くことがなくなりました(笑)

めでたく(?)趣味プログラマになりました。
まぁ、趣味で自由にやってたほうが気が楽なので割り切りますが、寂しい限りです。
さて、ExtJsにであってJavaScriptを触り始めましたが、
ほんのすこし慣れてきたような気がします。

でもいつかExtJsを仕事でつかうんだ!という野望は捨てず
遊び続けよう!!

さて、
先日お絵かきしたものを実装するにあたりJavascriptってやわらかくて
実装方法がいろんな書き方があってあっちいったりこっち行ったりして
自分ルールが決まってませんでした。あるソースではthis拡張で継承したり
あるソースではprototypeの継承なんだけど書き方がちがったりと。
いまだに慣れません。コード書いてる量も少ないし。。

誰に聞きくでもなく(先日夜中@kotsutsumiさんにクロージャについて聴いちゃいましたが)、
会社の人間にも聞ける人いないしなぁ。
ということで
これまたエイヤと決めました。(initは便宜上ってことを書いておかないとあとで忘れる)

■抽象クラスはこーしよう
Ext.ns('test');

//抽象クラスのためコンストラクタ実装なし。としてみる。普通にインスタンス化できちゃうけどなぁ。
test.AbstractClass = function () {};

//基底クラスだから継承なし。でここでは実装せず、ほかにあわせて、わざと空実装にしてしまおう。
test.AbstractClass.prototype = {};

//protptype.xxxをいちいちやるのは面倒な実装。これ好き。
(function () {
    var me = this;
    //メンバ
    me.abstractMember = {};
    //private
    me.init = function (config) {
        var me = this;
        me.abstractMember = config;
    };
    //抽象クラスのメソッド(オーバーライドがされることの確認用)
    me.testalert = function () {
        var me = this;
        alert('AbstractClass');//こいつが呼び出されるとこまる
  };
}).apply(test.AbstractClass.prototype);

■具象クラスはこーしよう
Ext.ns('test');

//具象クラス コンストラクタ
test.ConcreteClass = function () {
    var me = this;
    //superclass init ヨビダシ。
    me.init.apply(me, arguments);
};

//prototype継承
test.ConcreteClass.prototype = new test.AbstractClass();

//protptype.xxxをいちいちやるのは面倒な実装。これ好き。
(function () {
    var me = this;
    //オーバーライドできてるかな?
    me.testalert = function () {
        var me = this;
        //継承したプロパティをちゃんと参照できてるか?
        alert(me.abstractMember);
    };
}).apply(test.ConcreteClass.prototype);

■確認
Ext.onReady(function() {
    //testConcreteを生成(内部でSuperSuperClassのinitを呼び出し、SuperClassのプロパティに値を設定)
    var testConcrete = new test.ConcreteClass('ConcreteClass');
    testConcrete.testalert();
});

方針もかたまり、おおむね実装も完了しそう。。、もうちょいなかんじなんだよなぁ。

実装にあたって勉強させてもらいました。
が、読むのがやっとです。
ありがとうございました。
いやぁ、おもしろいなぁ、むずかしいなぁ。と。


■JavaScript OOP におけるクラス定義方法
http://d.hatena.ne.jp/amachang/20060516/1147778600
http://d.hatena.ne.jp/amachang/20080208/1202448348
■猿でもわかるクロージャ超入門 まとめ - DQNEO起業日記
http://dqn.sakusakutto.jp/2009/01/javascript_5.html
■JavaScript継承パターンまとめ
http://d.hatena.ne.jp/shogo4405/20070121/1169394889
■プロトタイプ(prototype)による JavaScriptのオブジェクト指向
http://codezine.jp/article/detail/222?p=1
■Javascript/ 継承/protected的メンバ作成
http://yakinikunotare.boo.jp/orebase/index.php?Javascript%2F%B7%D1%BE%B5%2Fprotected%C5%AA%A5%E1%A5%F3%A5%D0%BA%EE%C0%AE
■JavaScriptの再利用とapply
http://mumrik2.spaces.live.com/blog/cns!51ED6D671E97A131!223.entry
■JavaScript で継承やるときにprototype書きまくるのめんどい人は
http://d.hatena.ne.jp/iskwn/20091215/1260828978

0 件のコメント: