虚拟DOM

基本步骤

1、模板+数据=>虚拟DOM（js对象）=>真实DOM

2、数据发生变化=>模板+新数据=>新的虚拟DOM（js对象）

3、对比的是新旧虚拟DOM（js对象）

4、（根据diff算法）找到差异点

5、根据1找到差异点进行修改

虚拟DOM可能出现的面试题

1、你了解虚拟DOM吗

2、什么是虚拟DOM

虚拟DOM就是一个普通的js对象，可以描述真实的DOM

3、为什么要用虚拟DOM

因为更新的时候，如果对比两次真实DOM，是操作了DOM，非常影响性能，操作DOM是前端的瓶颈，是非常不可取的。而虚拟DOM是js对象，如果对比js对象，则会比对比DOM性能高多了。

4、他们是怎么对比的

4.1、模板+数据=>虚拟DOM（js对象）=>真实DOM

4.2、模板+新数据=>虚拟DOM（js对象）

4.3、对比新旧虚拟DOM

4.4、通过diff算法，找到差异

4.5、根据差异更新真实DOM

5、通过什么算法进行对比

diff算法

6、算法有什么好处

降低了算法的复杂度

diff算法

好处：降低了算法的复杂度

说明：层级分类，统计比较，加个key

为什么要加key：

1、就地复用策略

2、对比的时候 通过key快速找到对应的虚拟元素（VNode）VDOM