vue源码分析——path解析的状态机设计

[code]var obj = {
a:{
b:'hello',
c:['Marry','Ella']
}
}

对于对象a来说，我们使用‘a.b’就能获得字符串hello，那么vue是如何解析a.b的呢？vue.js 是通过状态机管理 来实现对路径的解析的。Vue 将表达式的访问路径字符串 解析成数组的形式，‘a.b’就解析成为['a','b']，通过obj[arr[0]][arr[1]]来获得属性值。

源码中分别有四种操作，和9种状态

四种操作的具体如下

而九种状态分别对应以下状态模型，每一种状态模型有各自接收的输入，转移的状态，相应的操作

仔细阅读源码就知道，Vue 的状态机模式解析 path 实际上是将 path 的每个索引的字符视为一个状态（getPathCharType（）方法），将 接下来一个字符 视为 当前状态的 输入，并 根据输入 进行 状态转移 以及 响应操作，如果遇到异常就直接跳出，状态机终止，无异常则运行至终止状态。

整理一下状态模型可得下图 

 拆分源码示例https://github.com/EllaYan/Vue-path-analysis