Asial Blog

Recruit! Asialで一緒に働きませんか?

E4Xのまとめ-その1-

カテゴリ :
フロントエンド(HTML5)
タグ :
Tech
Flex
E4X
ActionScript
XML
Flex大好き。橋本です。

さて、今日はFlexでXMLデータを操作するために使用する「E4X」の使用方法についてまとめていきたいと思います。
(個人的な備忘目的だったりします。。)

書いてるうちに長くなってしまったため、2回に分けていきたいと思います。

まず、E4Xとは何かと言いますと、ECMAScript3 のXML データを扱うための拡張仕様のことです。

E4Xでは、XMLデータは、AS3のネイティブデータ型である、XML型とXMLList型、それぞれのクラスであるXMLクラスとXMLListクラスで表されます。
各XMLインスタンスは、次の5種のXMLの内容のいずれかを表します。

・エレメント
・属性
・テキストノード
・コメント
・処理命令

XMLListは、一つ、または複数のXMLインスタンスの集まりです。
XMLエレメントが子エレメントをや子テキストノードをもつ場合には、子はその親のXMLインスタンスによって、XMLList内に包含されます。

・XMLデータの初期化方法
1.リテラル形式でXMLデータを記述する
  1. var xml:XML = <sample attr="hogehoge">
  2.   <hoge>hogehogehoge</hoge>
  3.   <fuga>fugafugafuga</fuga>
  4. </sample>;

インスタンス作成時には、文字列で指定することも可能です。
  1. var str:String = '<sample attr="hogehoge"><hoge>hogehogehoge</hoge><fuga>fugafugafuga</fuga></sample>';
  2. var xml = new XML(str);

ダイナミックにエレメントの内容を指定することも可能です。
  1. var rootName:String = "sample";
  2. var rootAttrName:String = "attr";
  3. var rootAttrVal:String = "hogehoge";
  4. var elementNames:Array = ["hoge", "fuga"];
  5. var elementVals:Array = ["hogehogehoge", "fugafugafuga"];
  6.  
  7. var xml:XML = <{rootName} {rootAttrName}={rootAttrVal}>
  8.   <{elementNames[0]}>{elementVals[0]}</{elementNames[0]}>
  9.   <{elementNames[1]}>{elementVals[1]}</{elementNames[1]}>
  10. </{rootName}>

・XMLデータへのアクセス方法
以下の二種類の方法があります。
1.メソッドの利用
  1. attribute()
  2. attributes()
  3. child()
  4. children()
  5. comments()
  6. descendants()
  7. elements()
  8. parent()
  9. processingInstructions()
  10. text()

2.変数スタイルのアクセス方法の利用
  1. ドット演算子(.)
  2. 属性演算子(@)
  3. 子孫演算子(..)

・具体的なアクセス方法
  1. var xml:XML = <nodes attr="hogehoge">
  2.   <hoge>hogehogehoge</hoge>
  3.   <fuga>fugafugafuga</fuga>
  4. </nodes>;
  5.  
  6. //ルートへのアクセス
  7. hogeFunc(xml);
  8.  
  9. //(hgoeFunc(xml.nodes)は間違い。<nodes>エレメントは、xmlノードの子ではありません)
  10.  
  11. //子ノードへのアクセス
  12. xml.children(); //<nodes>の子ノードを表すXMLListを返す
  13.  
  14. xml.* //プロパティワイルドカードを使用することも可能
  15.  
  16. //特定の子へのアクセス
  17. xml.children()[0]
  18.  
  19. xml.*[0]
  20.  
  21. //最初の子へのアクセス
  22. xml.children()[0]
  23.  
  24. //最後の子へのアクセス
  25. xml.children()[xml.children().length() - 1]
  26.  
  27. //名前でアクセス
  28. xml.child("hoge") //"hoge"という名前の<nodes>ノードの子エレメントを全て返す
  29.  
  30. xml.hoge

同じ名前のノードが二つ以上ある場合には、2つのXMLエレメントを持ったXMLListエレメントが返ってきます
  1. var xml:XML = <nodes>
  2.   <node>hoge</node>
  3.   <node>fuga</node>
  4. </nodes>;
  5.  
  6. xml.node[0] // "hoge"
  7. xml.node[1] // "fuga"

結果が一つしか無い場合は、XMLエレメントを一つだけ含んだXMLListが返ってくるのですが、この場合には、XMLListをXMLオブジェクトのように扱うことができます。
  1. var xml:XML = <nodes>
  2.   <node>hoge</node>
  3. </nodes>;
  4. xml.node // "hoge"

・テキストノードへのアクセス
  1. var xml:XML = <nodes>
  2.   <node1>hoge</node1>
  3.   <node2>fuga</node2>
  4. </nodes>;
  5.  
  6. //XMLインスタンスとして参照する場合
  7. var hoge:XML = xml.node1.children()[0]
  8. var hoge:XML = xml.node1.*[0]
  9.  
  10. //Stringとしてアクセスしたい場合
  11. var hoge:String = xml.node1.toString()
  12. (xml.node1[0].toString())
  13.  
  14. //toStringメソッドは省略可能です。
  15. var hoge:String = xml.node1
  16.  
  17. //まとめてテキストノードだけを取得することもできます
  18. xml.*.text()
  19.  
  20. xml.*.text()[0] // "hoge"
  21. xml.*.text()[1] // "fuga"

・親ノードへのアクセス
  1. var xml:XML = <nodes>
  2.   <node1>hoge</node1>
  3.   <node2>fuga</node2>
  4. </nodes>;
  5.  
  6. var hoge:XML = xml.node1[0]
  7. hoge.parent() // <nodes>へのアクセス

parent()を続けて使用することも可能です。
  1. var xml:XML = <nodes>
  2.   <node1>
  3.     <node2>fuga</node2>
  4.   </node1>
  5. </nodes>;
  6.  
  7. var node2 = xml.node1.node2[0]
  8. node2.parent().parent() // <nodes>エレメント

属性を表すXMLインスタンス上で呼び出されると、その属性が定義されているエレメントを返します
  1. var xml:XML = <nodes>
  2.   <node1 attr="fuga">hoge</node1>
  3. </nodes>;
  4.  
  5. xml.@attr.parent // <node1>エレメント

・属性へのアクセス
  1. var xml:XML = <nodes attr="fuga">
  2.   <node1>hoge</node1>
  3. </nodes>;
  4.  
  5. xml.attributes() //<nodes>の全ての属性を表すXMLListを返す
  6.  
  7. // 属性ワイルドカードを使用することも可能です
  8. xml.@*
  9.  
  10. // 特定の属性へのアクセス
  11. xml.attribute("attr")
  12.  
  13. // 変数シンタックス
  14. xml.@attr
  15. // (本当は、xml.@attr[0]。一つしかない場合は、[0]を省略できる)
  16.  
  17. // 属性の値へアクセスするとき
  18. var hoge:String = xml.@attr.toString()
  19.  
  20. // toString()は省略出来ます
  21. var hoge:String = xml.@attr

・コメントへのアクセス
デフォルト設定では、E4Xパーサはコメントを無視します。
コメントにアクセスするようにするには、XML.ignoreCommentsをfalseにする必要があります。
XML.ignoreCommentsはstaticな変数なので、クラスに対して設定する必要があります。

  1. XML.ignoreComments = false;
  2.  
  3. var xml:XML = <nodes attr="fuga">
  4.   <!-- これはコメントです -->
  5.   <node1>hoge</node1>
  6. </nodes>;
  7.  
  8. trace(xml.comments()[0]) // "これはコメントです"

・イテレーションによるアクセス
  1. var xml:XML = <nodes>
  2.   <node1>hoge</node1>
  3.   <node2>fuga</node2>
  4.   <node3>foo</node3>
  5. </nodes>;
  6.  
  7. for each(var a:XML in xml) {
  8.   trace(a); // "hoge", "fuga", "foo"
  9. }

というわけで、今日は基本的な部分についてまとめてみました。
次回は、子孫ノードへのアクセス、条件判定などについて、突っ込んで行こうと思います。