vue源码虚拟DOM和diff算法

1.虚拟dom:用js对象将真实的DOM的属性、节点描述出来。

一个虚拟DOM的属性：sel、data、children、elm、key、text

使用h函数得到虚拟DOM树

2.diff算法

　　1.只有是同一个虚拟节点，才能进行精细化比较，否则就是暴力删除旧的插入新的。    同一个虚拟节点，选择器相同且key相同

　　2.只有同层进行比较，不会进行跨级比较。

3.patch函数

 

 diff处理新旧节点是同一个节点时，新旧节点都有children时，采用子节点更新策略。

四种命中查找：

①新前与旧前

②新后与旧后

③新后与旧前 （新前指向的节点，移动到旧后之后）

④新前与旧后 （新前指向的节点，移动到旧前之前）

如果命中一种，不进行其他的命中判断，指针开始移动

若四种都没有命中，则采用循环来查找，如果新前的index大于新后，旧前的index大于旧后，则循环结束。

如果旧节点先循环完毕，说明新节点中有要插入的节点。如果新节点先循环完毕，则旧节点有要删除的节点。