夜以深，人未眠，本該入睡，然逢周末，無聊甚哉，故於此作文打發時間-----------
前幾日，無聊，小試了下javascript版本的mustache模版，說是小試，其實主要目的是閱讀學習其源碼。如果僅僅是去學會如何使用它，相信除了實際開發中對你有些幫助外，寫幾個小demo應該是沒啥大意思的（雖然我現在正在做這樣的事情。ps：好吧，我錯了）。言歸正傳，這里之前之所以說是javascript版本的，原因是它必然有其它版本，如果你想了解其它語言版本，這里點擊此鏈接http://mustache.github.com/它會把你傳送過去。
今天呢，其它的版本就不研究了，就試試javascript版本的吧。看到着，你或許疑惑，這模版啥玩意？別急，請慢慢往下閱讀。
一、在前端為什么需要模版
隨着互聯網前端頁面越來越復雜，交互性越來越強，如今，對於前端的要求也是越來越高，當然本文這里指的主要是前端的javascript。在XX年前，記得我還在讀書上學的時候。當時javascript就像個玩具，筆者也不止一次的被人告誡，javascript只是給網頁增加點特效，而且很多瀏覽器對它支持不夠諸如此類，大概就這些，具體也記得不清楚了，反正就是勸人不要太花時間在它上面。在當時來看，確實如此啊。又怎知世界變化如此之快，又有誰知如今javascript已然發展到如此？一不小心又扯遠了，嘿嘿，回來。其實，相信如果你在開發中，遇到頁面需要通過ajax加載一些東西，例如后台傳來的一個用戶信息列表，假設結構如下：
1 {"users":[{"name":"sam","age":14},{"name":"jack","age":24},{"name":"lucy","age":19}]}
在過去，我們都是通過解析后台傳來的json對象，以前面說的用戶列表為例，需要迭代每一項，然后通過js字符串拼接並加入需要的標簽和樣式,最后動態添加到頁面中去。這樣做當然沒什么問題，但是寫起來是有些麻煩的，因為你得一次一次的拼字符串，但其實這也不是重點，最重要的是這樣做維護起來也不方便，如果你需要換個展現形式，你得換上標簽，再一個個仔細的拼接，每次看到一堆js中夾雜着html的代碼時，就會頭暈。於是，為了解決這個問題，一大堆的模版就出現了。比較典型的就是jquery的template plugin，kissyTemplate，artTemplate，還有今天講到的mustache等等。至於它們之間的優劣性能等等這里就不討論了，有興趣可以自己找資料測試。既然模版可以讓處理以上的問題變得簡單，那么mustache又是如何處理，如何使用的呢？
二、如何使用mustache
首先，當然是下載mustache嘍，執行npm install mustache（電腦上需要裝有Node.js與npm，如果不想這樣下載安裝mustache，直接進https://github.com/janl/mustache.js下載）
下載完成后，打開看下mustache.js文件，大概只有600行左右的代碼，相當簡潔啊。截取開始部分如下:
看了下，頭部，顯然支持CommonJS與AMD規范了，也就是說Node.js也亦可以使用它作為模版引擎，非常棒，雖然還沒試過。
看了下官方，上面說mustache主要特點是logic less Templates ，意思說，模版中無邏輯或者說很少邏輯。畢竟模版只是作為一個view而已，不需要太多的邏輯代碼。它主要是通過{{ }}符號來傳遞變量的（這么說也許並不科學，只是大致可以這么理解）。還是先看個簡單例子：
上面有一個people的對象，里面有三個屬性，其中一個屬性是一個函數。mustache的使用非常簡單，調用只需要Mustache.render(temp,obj)函數就可以了，其中第一個參數是你寫的模版，第二個參數是你需要渲染到模版的對象。最終返回渲染完成的字符串，這里，我們最后把他寫入html文檔的div標簽內。
看到這，你應該可以明白模版渲染對象，提取屬性的值渲染到模版的特定位置，可以理解為：{{key}} = 》 value 。
這里只是簡單渲染了一個對象，那么對於文章開頭提出的列表對象，又該如何做呢？看示例：
模版中通過{{#listkey}}
{{/listkey}}
中間包裹列表中每一項的key
{{#listkey}}{{#itemkey}}{{/listkey}}
這樣模版引擎會自動迭代每一項，並渲染到模版中去，是不是很簡單。當然以上這些只是最基本的用法，更復雜的用法和它內部的機制今天就不寫了，太晚了，寫着寫着天都快亮了，還是先睡覺了zZZ