三行JS代码实现 简单的模版引擎算法 面试常考

前端的面试或者校招中经常会问到的一道简单的算法题：

模版引擎（给你一段模版代码，给你一个对象；转换出来html代码格式）

下面是正则实现的（借鉴大佬的代码）

代码如下：

var template='<p>sd,<%page%>,hello,<%w%></p>'
var data={
    page:'yes',
    w:'world'
}

var reg=/<%([^%>]+)?%>/g;
while(mat=reg.exec(template)){
    template=template.replace(mat[0],data[mat[1]]);
}

具体原理

reg的这行正则的意思就是匹配出来关于<%和%>中间的内容。结尾的g是不仅匹配一次的意思，输出mat的内容是这样子的：

两个数组，第一行是匹配到的内容，第二行是你想要的内容，所以mat[0]==='<%page%>'; mat[1]='page';

之后用replace进行替换，将data的属性赋值过去就完成了；

有帮助的话点个赞，非常感谢！

复杂一些的推荐看这篇文章的优化部分；

https://segmentfault.com/a/1190000010366490