vue源码之mustache模板引擎库{{}}

1.模板引擎：将数据变为视图最优雅的解决方案

模板引擎库：mustache

//模板 
<ul>
{{#arr}}
<li><div class="hd">{{name}}的基本信息</div> <div class="bd"> <p>姓名：{{name}}</p> <p>性别：{{sex}}</p> <p>年龄：{{age}}</p>
</div>
</li>
{{/arr}}
</ul>
//数据

使用：不循环、数组嵌套、布尔值

2.机制

 

 tokens是模板字符串的js表示。

 

 

3.模板字符串到token中，采用#入栈 /出栈的思想，嵌套数组的children

模板字符串的拼接，采用指针的跳转，转换成toke的js表示方法。

tooken与数据结合时，采用递归的思想，有获取a.b.c的情况，采用lookup函数，循环遍历数据的数组，数据的长度就是递归的次数，将字符串拼接，最后innerHTML。

4.代码在github上