IT Office Nishimiyahara

個人用スマホから商用プログラミングまでなんでもお任せ下さい

Zusaarのページを更新しました

   

@nqounetです。

Zusaarのページというか、Oboe.jsのサンプルページがあまりにも手抜きすぎたので、整形済みテキストではなくHTMLで書くようにしました。

テンプレート

よく言われるフレームワークに、MVCフレームワークというのがあります。

Model, View, Controllerというものをそれぞれ独立させることで、開発を容易に行えるようにするものです。

協業する際に、Viewの部分をデザイナーさんに任せられると楽だなぁ、と思いながらよく使うのですが、まあ、なかなかそんな方はいません。

例えば、jQueryで新しいリストを追加する時にこんなことしていたら大変ですよ。

HTMLの中にパラメータを入れると、生成されるHTMLが想像しやすいですね。

実際に、リストで追加したい場合は、複数の要素があるのが普通ですので、liの部分をテンプレートにしておくと結構楽です。

このようなテンプレート機能を持つシンプルなライブラリとしてMustacheがあります。

Mustacheを使ってリストの要素のテンプレートを使ったスクリプトを書くとこんな感じです。

リストを増やしたい場合は、render部分をループに入れておく、という方法があります。

Mustacheでも配列を操作できます。例えば、以下の様な構造のデータがあったとした場合です。

listは、textというプロパティを持った配列です。

これをリスト形式で表示するには、以下の様なテンプレートを用います。

値がなかった時は、リストではなく段落で表示したりすることもできますよ。

Oboe.jsはループの中身の処理を書く

Oboe.jsは、nodeイベントがあるお陰で、通常のJSON解析後、ループで処理する部分で処理が可能になります。

普通の配列(例えばevents)を処理する場合は以下のようになるでしょう。

Oboe.jsの場合は以下のようになるでしょう

どちらも同じ関数で処理ができますね。

ループの中身は簡単にイメージできると思うので、それと同じように書けるのも利点の1つだと思います。

参考になる資料

respo

respo link

ZenBackWidget

 - 情報技術について , ,