JavaScriptでヒアドキュメントを使うライブラリを作った。

JavaScript

JavaScriptでヒアドキュメントを使うライブラリを作りました。

heredoc.js

テスト

外部ファイルサンプル

使い方

scriptタグ内に直接書き込む使い方(インラインモード)と、外部ファイルを読み込んでコールバックを実行する使い方があります。


インラインモード

<script src="heredoc.js">

# ここはscriptとして解釈されません。

str1 =<<EOT
複数行の文字列です。
下の行でおわりです。str1はグローバルになります。
EOT

obj.property_name = <<komoji_de_ok
プロパティや配列にも書き込めます。
komoji_de_ok

obj[0] =<<"END_OF_TEMPLATE"
<a href="#{uri}">#{label}<\/a>
END_OF_TEMPLATE

</script>


外部ファイル読み込み

<script type="text/javascript" src="heredoc.js"></script>
<script type="text/javascript">
var callback = function(values) {
  alert(values.str1);
}
Heredoc.load("./templates.txt", callback);
</script>

外部ファイルの記法はインラインの場合と同じですが、下記のETAGOのエスケープが不要になります。

インラインモードの制限

ヒアドキュメントをscriptタグ内に書く場合、HTMLの仕様によりETAGO(</)を文字列内に書けません。以下のようにバックスラッシュでエスケープしてください。

template =<<"EOT"
<a href="#{uri}">#{label}<\/a>
EOT

この制限があるため、HTMLテンプレートに使う場合は外部ファイルを読み込む方が便利です。外部ファイルには、ETAGOの制限はありません。エスケープも実行されません。


ダブルクォートでTemplateを作成

ヒアドキュメントの終端文字列(EOT)をダブルクォートで囲むと、

template =<<"EOT"
<a href="#{uri}">#{label}</a>
EOT

デフォルトの実装では以下のcreate_templateを呼び出します。

Heredoc.create_template = function(src) { 
	if (Template) {
		return new Template(src); 
	}
	return src;
}

Templateが定義されている場合はTemplateオブジェクトを作成し、そうでない場合は普通に文字列を返します。

prototype.jsのTemplateを使う時にダブルクォート記法が便利です。Templateは、

$("foo").innerHTML = template.evaluate({uri:"/index.html", label:"abc"})

のようにして使います。

prototype.jsに依存したくない場合は、上記のfunctionを消すなり書き換えるなりしてください(Templateが定義されていなければそのままでも大丈夫です)。

インラインモードを使いたくない場合

インラインの読み込みが嫌な場合は、heredoc.js末尾の

Heredoc.parseInline();

を消してください。

でも速度にはほとんど影響ないようでした。

確認環境

  • IE6
  • IE7
  • Firefox2
  • Opera9

Safari2とSafari3が未確認ですが、前のバージョンが動いていたのでたぶん動くと思います。

参考にした記事