還在痛苦的手工拼接HTML基茵？
使用模板引擎渲染出目標HTMl奋构，避免手工拼接的錯誤，同時增加模板代碼的可讀性拱层。
話不多說声怔，先看代碼，此demo實現(xiàn)了一個輕量的模板引擎舱呻。
模板引擎的核心
正則表達式的單元匹配醋火，以及replace函數(shù)。
模板采用雙大括號的形式來標識此處是模板插槽箱吕，匹配到的可以是一個變量芥驳，同時也可以是對象訪問屬性。
replace函數(shù)第二個參數(shù)茬高，支持傳入function配合正則的匹配兆旬。
/{{((\w+\.?)+)}}/g
正則表達式當中一個括號代表一個匹配組
\w 匹配字母、數(shù)字怎栽、下劃線丽猬。等價于[A-Za-z0-9_]
+ 匹配前面的子表達式一次或多次
？ 匹配前面的子表達式零次或一次
render 函數(shù)的實現(xiàn)
支持對象的屬性訪問
function render(tpl, data) {
var reg = /{{((\w+\.?)+)}}/g
return tpl.replace(reg, function(matchItem, keyName) {
let keys = keyName.split('.');
if (keys.length === 1) return data[keys[0]];
let res = data;
for (let item of keys) {
res = res[item];
}
return res;
})
}
