一種輕便且靈活的js模板的思路

在vue、react、angular等大前端框架異軍突起的今天，寫前端時已經很難用得上普通模板引擎了。因為這些框架都自帶dom渲染的功能，甚至由於虛擬dom技術的存在，使得dom渲染的效率比普通模板引擎更高。

但是在某些場景，仍然有用模板引擎的需求，比如寫外掛程式之類的（我就是在寫外掛程式的時候想到這個問題的-_-）。如果直接拼接html**，會讓整體**的可讀性變低；但是我又不想用現成的模板引擎，感覺有點太重了，本來寫外掛程式就想要輕便效率。

於是，我就有了乙個處於直接拼接html**和使用模板引擎之間的乙個思路。（很可能我並不是第乙個想到的，在這裡只是**一下）

var template = function(temp, params, repeat)}/g,function(a,b)]/g,"")];
if(typeof value === "function")else
})} 
return ret;
}

因為一般用模板來生成html**，最常用的功能就是遍歷和條件判斷，這個思路就是基於這一點出發的。

引數temp是模板字串，例如'}:}

'，因為我用vue比較多，所以這裡用的也是}。

引數repeat表示當前模板字串需要重複的次數，比如傳10的話，就會生成10個div。

引數params用來定義模板裡的變數，例如：

,
"num": function(index),
"prefix": "no"
}

變數名稱一定要一一對應。

引數裡可以定義常量，比如"prefix": "no"，表示模板中的prefix變數會被替換為字串no；

還可以定義成乙個function，這個function接收當前遍歷的index作為引數：

"num": function(index)

返回值則會被替換到對應的模板變數中，比如這個num就會被替換成1到10。

在function裡也可以再放入乙個template，比如：

var temp = '';
var lists = '}';
var t = template(temp, 
}, 10);
}});