師走なのか、なんなのか、忙しすぎてブログ書く時間がありません…。
ということで、スキップエントリーでも書いてしまおうかと思ったけど、
ちょっとでもいいから書いておこうかなぁと、振り絞って書きます。
粗いの勘弁w
Sencha Ext JS 4、および Sencha Ext JS 5は、Sencha Coreと呼ばれる
コアパッケージから成り立っています。
Ext JSは、パッケージ（ローカルnpmみたいな）管理されていて、
テーマ、チャート、そして、Sencha Coreなど、利用するパッケージを指定して、
Sencha Cmdが上手く配置してくれる仕組みがあります。
まぁ、Sencha Cmdのパッケージの話し始めると1日終わるんで、どっかで。
んで、クラスシステムなんですけど、4と5で色々変わっていまして、
本当は、骨の髄までしゃぶるくらいリスト化してやろうとおもってたんですが。
無理でした…時間的に。
なので、とりあえず、これだけはというのを。
プライベートメンバを作成する
これ、確か昔にどっかで書いたかもしれませんが、Ext JS 4の場合、Ext.defineの第二引数に関数オブジェクトを指定して実現するんですね。
具体的には、以下のようになります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
Ext.define('MyApp.hoge.Hoge', function() { // privates prvProp = 1; return { pubMethod: function() { // アクセス可能 console.log(prvProp); } }; }); // アクセス不可能 Ext.create('MyApp.hoge.Hoge').prvProp; |
まぁ、ここ1年くらいで、Ext JS 4 から入った人、Ext JS 5最近さわり始めた人は、
Ext.defineが何となくクラスを定義するものであることは、理解しているようですが、
その詳細までは、意外とテンプレで覚えてるだけで、こういうことができるのは覚えておくと良いです。
また、脱線しますけど、クラス定義後の処理は、第三引数に関数オブジェクトを指定します。
先ほどのクラスの場合だと
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
Ext.define('MyApp.hoge.Hoge', function() { // privates prvProp = 1; return { pubMethod: function() { // アクセス可能 console.log(prvProp); } }; }, function() { // ここ }); |
これは、あくまでクラスが定義された後に実行されるコールバック関数なんですけど、
クラスが生成されたタイミングではありませんので、ご注意を。
一般的にアプリケーション開発では、使わないかもですね。
さて、Ext JS 5では、上記のプライベートクラス作成が、もっと楽にできるようになっています。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
Ext.define('MyApp.hoge.Hoge', { privates: { prvProp: 1 } }); // アクセス不可能 Ext.create('MyApp.hoge.Hoge').prvProp; |
privatesメンバに、オブジェクトで、プライベートにしたいメンバを定義するだけです。
コードとしてもスッキリしますね。
まぁ以上なんですけど、似たような物に、staticsがあります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
Ext.define('MyApp.hoge.Hoge', { statics: { TRACE: 0, DEBUG: 1 } }); console.log(MyApp.hoge.Hoge.TRACE); // 0 |
まぁ、定数定義するときも、こんな感じで。
JavaScriptをちゃんと理解していれば、Prototypeチェーンや、スコープチェーンなど
上手く使いこなして、なんとでもなるんでしょうけど、最近nodeのコードとか色々みてても、
やはり、書けるのと、可読性が高いのは、別な話で、パッと見てなんとなく、こーだろうなって
予想が付きやすいコードが、どれだけ開発にやメンテナンスにおいて重要かを痛感しています。
そういう意味では、Sencha Coreクラスシステムは、mixins、requires、uses、extendなど含めて
コードも見やすく、動的ローディングも自動で行ってくれるので便利ですね。
ES6で、JavaScriptの仕様が拡張されていくなかで、その仕様を追いかけることも非常に重要な
行為ですが、なんども言いますが、Sencha Ext JSは、今日現在できる現実解を提示していると思います。
夢や理想、こうなるからすごい！とかいってて、うんこーど書いてるエンジニアも結構いるんですけど、
普通に、まともなエンジニアなら、Sencha Coreも他のライブラリも適材適所で使いこなせるはずなんですけど、
まぁその程度ってことなんですかね。
そういう意味では、Sencha Coreも、表面だけではなく、今回のように細かい使い方を是非テクニックとして
覚えて行ってもらえるといいなと思います
Sencha Coreのソースは、Ext JSのソース内に格納されています。
ext/packages/sencha-core
最後に、話は変わりますが、まだまだ作りかけなんですけど、とりあえず、nodeでおんなじ様なクラスシステム使いたいなぁ
と思って、CLI Frameworkってのをnpmで作りました。
興味のある方はどうぞ：
https://www.npmjs.org/package/cli-framework
ということで、義務は果たせたかな？w
