虚拟DOM (Virtual Document Object Model)
- DOM的本质是什么：浏览器中的概念，用JS对象表示页面上的元素并提供操作DOM对象的API；
- 什么是React中的虚拟DOM：框架中的概念，是程序员用JS对象模拟页面上的DOM和DOM嵌套；
- 为什么要实现虚拟 DOM（虚拟DOM的目的）：为了实现页面中DOM元素的高效更新；
- DOM元素和虚拟DOM的区别：
1.DOM:浏览器中的概念，用JS对象表示页面上的元素并提供操作DOM对象的API；
2.虚拟DOM:框架中的概念，是程序员用JS对象模拟页面上的DOM元素和DOM嵌套关系；
①本质：用JS对象模拟DOM元素和嵌套的关系；
②目的：为了实现页面元素的高效更新；
- 下面通过一个需求来说明React是如何实现页面的高效更新的：
虚拟DOM的原理
- 用JS模拟DOM树
Diff算法
- tree diff：新旧DOM树逐层对比的过程就是tree diff；当DOM树逐层对比完成后，即可找到所有需要被更新的元素；
- component diff：在进行tree diff的时候，每一层中组件级别的对比叫做component diff；
1.对比前后，组件的类型相同，则暂时认为该组件不需要被更新；
2.对比前后，组件的类型不同，则将旧的组件移除并创建新的组件，同时将组件追加到页面；
- element diff：在进行组件对比时，如果两个组件类型相同，则需要进行元素级别的对比，即element diff；
总结：虚拟DOM提供了创建DOM树的方法，Diff算法提供了新旧DOM树对比的最优算法，以达到按需更新的目的。
理解了DOM、虚拟DOM的概念以及diff算法是如何实现按需更新的，接下来将进行具体的语法学习阶段~~