## 虚拟dom && diff算法 （ 王者 ）

1. 虚拟dom是什么？

   1) vdom可以看作是一个使用javascript模拟了DOM结构的树形结构，
   这个树结构包含整个DOM结构的信息
   
   ２）为什么要使用虚拟DOM ,vdom的好处？
   之前使用原生js或者jquery写页面的时候会发现操作DOM是一件非常麻烦的一件事情，
   往往是DOM标签和js逻辑同时写在js文件里，
   数据交互时不时还要写很多的input隐藏域，
   如果没有好的代码规范的话会显得代码非常冗余混乱，耦合性高并且难以维护。
   另外一方面在浏览器里一遍又一遍的渲染DOM是非常非常消耗性能的，
   常常会出现页面卡死的情况；所以尽量减少对DOM的操作成为了优化前端性能的必要手段，
   vdom就是将DOM的对比放在了js层，通过对比不同之处来选择新渲染DOM节点，
   从而提高渲染效率。
   

2. 虚拟dom的使用基本流程

	虚拟DOM是在js内存中构建一个类似于DOM的对象。
	利用js定义一个object对象去模拟DOM，拼装数据，拼装完成之后，
	对整体进行解析，渲染，并插入到html文档中，形成一个虚拟DOM。
	步骤：
	1.获取数据

​ 	2.创建vdom

	​ 3. 通过render函数解析jsx，将其转换成 vdom结构

​ 	4.将vdom渲染成真实dom

​ 	5.数据更改了

​ 	6.使用diff算法比对两次vdom,生成patch对象

​ 	7.根据key将patch对象渲染到页面中改变的结构上，
而其他没有改变的地方是不做任何修改的（ 虚拟dom的惰性原则 ）

3. 什么是jsx?
   1. jsx javascript + xml
4. diff算法是什么？

	两个相同的组件产生类似的DOM结构，不同的组件产生不同的DOM结构；
	同一层级的一组节点，他们可以通过唯一的id进行区分。
	diff算法：新改后文件的与修改前的文件比较，
	将两个文件之间的差异之处生成补丁对象（ patch ）

5. diff算法运行结束之后，返回什么？
   注意： vue是一是MVVM框架，Vue高性能的原因之一就是vdom

深化： Vue vdom vs React vdom 有何不一样？

6. 验证 key

• 列表循环一定加key
• key最好是使用具有唯一标识性的 id

7. 为什么列表循环要加key ? ( 黄金 )

Vue有两大特性

1. 指令 – 用来操作dom

2. 组件 – 组件是html css js 等的一个聚合体

3. 为什么要使用组件？

   1. 组件化

      1. 将一个具备完整功能的项目的一部分进行多处使用
      2. 加快项目的进度
      3. 可以进行项目的复用

   2. 要想实现组件化，那么我们使用的这一部分就必须是完整的，我们把这个完整的整体就称之为组件

   3. 插件： index.html img css js

   4. 如果能将 html css js img 等多个部分放在一起，那该有多好，vue将这个聚合体的文件称之为，单文件组件（ xx.vue ）

4. 基础的组件创建

   1. 全局注册
   2. 局部注册

5. 必须掌握的

   1. vue是如何扩展组件的？
   2. vue为什么要以标签的形式使用组件
   3. 组件使用为何要注册

6. 组件的一些特殊使用规则 【 is 规则】

7. 组件的template