今日も陽気にアレグロ技研

allegorgikenの気が向いた時の日記です

E4X + JavaScript

最近Mixiのサマーインターンシップとかいってて更新してませんでした。
そこでmixiアプリなるものを作ってきたので、Javascriptのお勉強やら
チーム製作の技術やら、いろんなものが身についた感じがしてよいですね。

ところで、チーム製作に限らずひとつのファイルにごった煮でコードを書いていくのは辛いですね。
部門ごとにコードは複数のファイルに分割していくと書きやすく見やすくデバグしやすいというものです。

このmixiアプリでは、基本的にはひとつのXMLファイルにJavaScriptやHTMLやCSS
をどんどん埋め込んでいくという形でコーディングしていくんですが、
JSやCSSは外部ファイルを読み込めても、HTMLだけは外部ファイルを読み込めない!

そこでJavaScriptの『XMLリテラル』というものを使ってみようかなと。
WEBでもあまり情報がないもので、どう書いたものかよくわからない感じでした。
特に、リテラル内での式の埋め込みが今回つまりました。

var foo = "world";
var bar = <bar>Hello, { hello } !</bar>;

これだと、うまくいくのですが、要素の属性内での式の埋め込みでつまりました。

var foo = "world";
var bar = <bar foo="{ foo }">Hello, { hello } !</bar>;

これだと、barの属性fooは、{ foo }になってしまいます。これを回避するには、

var foo = "world";
var bar = <bar foo={ foo }>Hello, { hello } !</bar>;

クォーテーションを取ればよいだけでした。