目的

expressで最も早いと評判のテンプレート、ECTですが、構文(syntax)が整理されている所が無かったので自分で整理する事にしました。

参考

ここ=>http://ectjs.com/にも、ECTの説明と共にある程度乗ってます。
CoffeeScriptと近いですが、一致はしていないです。

構文(syntax)

・エスケープ無しで出力

<h1><%- @title %></h1>

・エスケープして出力

<code><%= @source %></code>

・IF文

<% if @value1? : %>
    <label>?で存在確認。false,"",0でも存在すればここです</label>
<% else if !@value2 : %>
    <label>[false,0,""+存在しない] を判断したければ!</label> <!-- ?と同じ役割も兼ねます -->
<% else if @value3 == "2" : %>
    <label>式で比較。=== は無くて、==で型の一致も見られます。</label>
<% else : %>
    <label>該当無し</label>
<% end %>

・変数の追加

<!-- 変数宣言。後続の処理でこの変数を使えます。 -->
<% @start_num = 0 %>

・三項演算

<!-- 三項演算で値を@strに入れます。 -->
<!-- @valueがあれば"a"。無ければ"b"が出力される -->
<% @str = if @value then "a" else "b" %>
<label><%- @str %></label> 

<!-- こちらは変数に代入せず直接画面出力する場合 -->
<label><%= if @value then "a" else "b" %></label>

・While文

<!-- 括弧内がtrueの間繰り返します -->
<% while (@start_num++ < @max_num) : %>
  <li><%- @start_num %></li>
<% end %>

・for文(配列の繰り返し)

<!-- 繰り返しは配列のみです。オブジェクト(map)はダメです -->
<% @value = [1,2,3] %>
<% for val in @value : %>
    <li><%- val %></li>
<% end %>

・Switch文

<% @oauthProvider='facebook' %>
<% switch @oauthProvider : %>
    <% when 'facebook' : %>
        <label>facebook</label>
    <% end %>
    <% when 'twitter' : %>
        <label>twitter</label>
    <% end %>
    <% else : %>
        <label>else</label>
    <% end %>
<% end %>

・関数の利用

// JavaScriptでテンプレートに関数を渡した場合
data.calc = function(a,b){return a+b;};
res.render('test', data);

<!-- test.ect -->
<!-- 画面側で利用可能 -->
<%= @calc(1,2) %>

・レイアウトの利用

<!-- page.ectファイル -->
<% extend 'layout.ect' %>
<!-- layout.ectの中の"content"の場所に読み込まれます -->
<div>Hello, World!</div>
<% block 'footer' : %>
    <!-- layout.ectの中の"content 'footer'"の場所に読み込まれます -->
    <span>Custom footer content</span>
<% end %>

　　＋

<!-- layout.ectファイル -->
<html>
    <body>
        <% content %>
        <footer>
            <% content 'footer' %>
        </footer>
    </body>
</html>

　　　↓

<!-- page.ectを表示した結果になります -->
<!-- layout.ectの中に、page.ectの内容と部品(blockの部分)が読み込まれます -->
<html>
    <body>
      <div>Hello, World!</div>
        <footer>
            <span>Custom footer content</span>
        </footer>
    </body>
</html>

・他ECTファイルの読み込み

<!-- 他ファイルをパラメータを含めて表示 -->
<!-- item.ectを読み込みますが、拡張子付きで指定すると
動きがおかしくなったので付けない方がいいです。 -->
<% include 'item', { item : 'book', price: '10$' } %>

　　↑ に読み込まれます。

<!-- item.ect -->
<div><%= @item %></div>
<div><%= @price %></div>

以上、まだ他にあるかもですが、これだけあればだいたい書けると思います。

(おまけ)出来なかった事

以下、出来そうかと思いましたが出来なかった事です。
もしやり方知っている方がいたら教えて下さい(>人<)

・ECTファイル内でのfunctionの定義

<!-- こういう風に、ECT内で変数作るように関数は作れなかったです -->
<% @calc=function(a,b){return a+b;} %>

・変数インクリメントするタイプのfor文

<!-- 実行できませんでした -->
<% for (@i = 0;@i < 5; @i++) : %>
   <li><%= @i %></li>
<% end %>

nodejs expressの爆速テンプレートECTの構文(syntax)整理

目的

参考