Vue状态机的开启与停止操作详细讲解

function parseChildren(context, ancestors){
	let nodes = []
	const { mode } = context
	while(!isEnd(context, ancestor)){
		let node
		if(mode === TextModes.DATA || mode === TextModes.RCDATA){
			if(mode===TextModes.DATA && context.source[0] === '<'){
				if(context.source[1] === '!'){
					// 省略部分代码
				}else if(context.source[1] === '/'){
					// 状态机遭遇了闭合标签，此时应该抛出错误，因为它缺少与之对应的开始标签
					console.error('无效的结束标签')
					continue
				}else if(/[a-z]/i,test(context.source[1])){
					// 省略部分代码	
				}
			} else if (context.source.startswith('{{')) [
				// 省略部分代码	
			}
		}
		// 省略部分代码	
	}
	return nodes
}

<div><span></div></span>

function isEnd(context, ancestors){
	if(!context.source) return true
	// 与父级节点栈内所有节点做比较
	for(let i = ancestors.length-1;i>=0;--i){
		//只要栈中存在与当前结束标签同名的节点，就停止状态机
		if(context.source.startsWith(`</${ancestors[i].tag}`)){
			return true
		}
	}
}

<div><span></div></span>

function parseElement(context, ancestors){
	const element = parseTag(context)
	if(element.isSelfClosing) return element
	ancestors.push(element)
	element.children = parseChildren(context, ancestors)
	ancestors.pop()
	if(context.source.startsWith(`</${element.tag}`)){
		parseTag(context, 'end')
	}else{
		console.error(`${element.tag}标签缺少闭合标签`)
	}
	return element
}