目的:将零散的token嵌套起来,将“#”和“/”下面的内容当做一项token
引出问题:不知道嵌套到第几层
解决算法:栈(后进先出)
官网的小技巧:使用collection(收集器)改变对象指向的变量
上代码:
parseTemplateToTokens.js
nestTokens.js
export default function nestTokens(tokens){
// 结果数组
var nestTokens = [];
// 收集器,指向同一个数组
var collection =nestTokens;
// 栈结构
var sections = [];
console.log(tokens)
for(let i=0;i<tokens.length;i++){
let token = tokens[i];
switch(token[0]){
case '#':
// 收集器放入token,此时nestTokens也是和collection一样的token对象,因为都指向同一个引用
collection.push(token)
// 入栈
sections.push(token)
// console.log(sections,"当前sections")
// 收集器换人,给token添加下表为2的项,并且让收集器指向它
token[2]=[];
collection = token[2]
// console.log(collection,"collection")
break;
case '/':
// 出栈,pop会返回刚刚弹出的项
let section_pop = sections.pop();
// 改变收集器为栈结构队尾(队尾是栈顶)下标为2的数组
collection = sections.length>0?sections[sections.length-1][2]:nestTokens;
break;
default:
// 不管是什么都默认收集所有的token,只有在做#和/时才判断和重新指向新的数组进行收集
collection.push(token)
}
}
return nestTokens;
}
index,js
最后输出这个处理后的tokens,
import parseTemplateToTokens from './parseTemplateToTokens.js'
window.SSG_TemplateEngine = {
render(template,data){
var tokens = parseTemplateToTokens(template)
console.log(tokens)
}
}
输出结果:
以上就能将零散的token全部收集起来了!!!