mushache工作的主要原理
模板
=> 通过扫描器类将模板转换为一个数组tokens,数组下标0保存扫描的内容是否在{ {}}中,不在{ {}}中,下标0为text,在{ {}}中,下标0为name,下标1为内容
=> 再对tokens进行处理,判断'#','/','.'
=> 将tokens处理HTML,并注入数据
=> 根据数据的length进行循环生成
=> 通过dom操作进行渲染
通过扫描器类将模板转换为一个数组tokens
那我们第一步就是先写个扫描器类Scanner
该类中有4个函数,constructor,scan,scanUtil,eos
constructor:构造函数
constructor(templateStr) {
//将模板字符串写到实例身上
this.templateStr = templateStr;
console.log("Scanner");
//指针
this.pos = 0;
// 尾巴
this.tail = templateStr;
}
scan:通过indexOf函数扫描tag参数并将pos指针后移,使scanUtil捕获时跳过tag.length
scan(tag) {
if (this.ta