Ext クラスオブジェクト:Ext JS勉強会(9月) その2

前回の続きです。

Ext.invoke

オブジェクトのメソッドをまとめてコールするためのメソッドです。

次の例では、HTMLElement(DOM要素)をExt.queryで配列として取得しています。その配列で取得されたHTMLElement一つ一つに、指定したメソッドを実行して結果を配列で取得します。

var result = Ext.invoke(Ext.query(“li.p”), ‘getAttribute’, ‘id’);
console.log(result);

Ext.queryは、CSSセレクタでHTMLElementを取得するためのメソッドで、Ext.invokeの第一引数は、実行したいオブジェクトたちを配列でしていするため直接記述しています。

先の例では、<li class=”p”></li> のタグを取得し、HTMLElementに対してgetAttributeを実行した結果を配列で取得しています。第三引数移行は、実行するメソッドの引数を指定します。

つまり、(HTMLElement).getAttribute(‘id’) とそれぞれのHTMLElementに対して行った結果を配列で取得していることになります。

Ext.partition

Ext.partitionは、条件に応じて、配列を2つに分けることができます。

var result3 = Ext.partition( Ext.query(“li.p”), function( value ) {

return( value.getAttribute( ‘id’ ) == ‘list3’ );

});

<li class=”p”></li>タグを取得して、そのIDが”list3″であるものと、そうでないものを分けています。
Ext.pluck

var result4 = Ext.pluck( Ext.query(“li”), “className” );

Ext.pluckは、Ext.invokeのプロパティ取得版です。つまり、第一引数に対象のオブジェクトを配列で渡し、第二引数に取得したいプロパティを設定します。

そうすると、それぞれのプロパティ値が配列で取得できてしまうわけです。この1行で。

Ext.flatten

var tmp5 = [ [ 1,2,3 ], [4,5,6] ];
var result5 = Ext.flatten(tmp5);

多次元配列を、1次元配列に変換します。上記の例では、123/456と2つに分かれた2次元配列を1次元に変換し[1,2,3,4,5,6]という配列を取得することができます。

Ext.zip

ZIPだからといって圧縮とか、郵便番号ではありません。

var result6 = Ext.zip([1,2,3],[4,5,6]);

2つの配列を行列変換てきな感じで扱うことができますといってもわかりにくいので・・・結果ですが

[[1,4],[2,5],[3,6]]といったカタチに変換することが可能です。

一つ目の配列、二つ目の配列、それぞれの添え字番号が同じものを1つの配列にして2次元配列で返却してくれます。

別々に取得したデータを、編集する際などに役立ちそうですね。

さー、おわり~(=_=;つかれた。

まとめたぞー、プログラム記事書いたぞー、えらいべーふぅ~orz

Ext クラスオブジェクト:Ext JS勉強会(9月) その2