VUE 前端中如何进行组件化开发？

1、前端里面常说的视图层是什么？

我们把HTML中的DOM就可以与其他的部分独立开来划分出一个层次，这个层次就叫做视图层。

Vue 的核心库只关注视图层

图1： dom对象树结构

图2：DOM和CSS 一起呈现

2、使用jquery开发完整页面的流程？

a、html写构架

b、css装饰

c、js交互

讲到JQuery，就不得不说到JavaScript的DOM操作了。如果你用JQuery来开发一个知乎，那么你就需要用JQuery中的各种DOM操作方法去操作HTML的DOM结构了。

现在我们把一个网页应用抽象一下，那么HTML中的DOM其实就是视图。

一个网页就是通过DOM的组合与嵌套，形成了最基本的视图结构（图1： dom对象树结构）。
再通过CSS的修饰，在基本的视图结构上“化妆”让他们看起来更加美观（图2：DOM和CSS 一起呈现）。
最后涉及到交互部分，就需要用到JavaScript来接受用户的交互请求，并且通过事件机制来响应用户的交互操作，并且在事件的处理函数中进行各种数据的修改，比如说修改某个DOM中的innerHTML或者innerText部分（图3：执行 Javascript 过程）。

图3：执行 Javascript 过程

3、Vue.js为什么能让基于网页的前端应用程序开发起来这么方便？

a、有声明式

b、响应式的数据绑定

c、组件化的开发

d、Virtual DOM

因为Vue.js有声明式，响应式的数据绑定，与组件化的开发，并且还使用了Virtual DOM这个看名字就觉得高大上的技术。

4、vue.js中常说的数据动态绑定是什么？

就是vue.js会自动响应数据的变化情况，并且根据用户在代码中预先写好的绑定关系，对所有绑定在一起的数据和视图内容都进行修改。而这种绑定关系，在图上是以input 标签的v-model属性来声明的，因此你在别的地方可能也会看到有人粗略的称vue.js为声明式渲染的模版引擎。

5、前端中为什么要组件化开发？

a、非组件化开发代码和工作量都非常大

b、修改起来生不如死

但是现在我们做单页应用，页面交互和结构十分复杂，一个页面上就有许许多多的模块需要编写，而且往往一个模块的代码量和工作量就非常庞大，如果还按照原先的方法来开发，那么会累死人。而且遇到以后的产品需求变更，修改起来也非常麻烦，生怕动了其中一个div之后，其他div跟着雪崩，整个页面全部乱套，或者由于JavaScript的事件冒泡机制，导致修改一些内层的DOM事件处理函数之后，出现各种莫名其妙的诡异BUG。

6、前端中如何进行组件化开发？

a、借用的后端的面向对象中的模块化思想（把一些大功能拆分成许多函数，然后分配给不同的人来开发）

b、把一个单页应用中的各种模块拆分到一个一个单独的组件（component）中，我们只要先在父级应用中写好各种组件标签（占坑），并且在组件标签中写好要传入组件的参数（就像给函数传入参数一样，这个参数叫做组件的属性），然后再分别写好各种组件的实现（填坑）

在面向对象编程中，我们可以使用面向对象的思想将各种模块打包成类或者把一个大的业务模块拆分成更多更小的几个类。在面向过程编程中，我们也可以把一些大功能拆分成许多函数，然后分配给不同的人来开发。
在前端应用，我们是否也可以像编程一样把模块封装呢？这就引入了组件化开发的思想。

Vue.js通过组件，把一个单页应用中的各种模块拆分到一个一个单独的组件（component）中，我们只要先在父级应用中写好各种组件标签（占坑），并且在组件标签中写好要传入组件的参数（就像给函数传入参数一样，这个参数叫做组件的属性），然后再分别写好各种组件的实现（填坑），然后整个应用就算做完了。

7、为什么有Virtual DOM技术？

a、问题

现在的网速越来越快了，很多人家里都是几十甚至上百M的光纤，手机也是4G起步了，按道理一个网页才几百K，而且浏览器本身还会缓存很多资源文件，那么几十M的光纤为什么打开一个之前已经打开过，已经有缓存的页面还是感觉很慢呢？

b、原因

（1）、浏览器本身处理DOM也是有性能瓶颈的

（2）、用JQuery或者原生的JavaScript DOM操作函数对DOM进行频繁操作的时候，浏览器要不停的渲染新的DOM树

这就是因为浏览器本身处理DOM也是有性能瓶颈的，尤其是在传统开发中，用JQuery或者原生的JavaScript DOM操作函数对DOM进行频繁操作的时候，浏览器要不停的渲染新的DOM树，导致页面看起来非常卡顿。

Virtual Dom && Diff（迁移）

8、Virtual DOM如何实现？

a、预计算dom的各种操作，把最后一次的结果渲染出来（减少dom的渲染次数）

而Virtual DOM则是虚拟DOM的英文，简单来说，他就是一种可以预先通过JavaScript进行各种计算，把最终的DOM操作计算出来并优化，由于这个DOM操作属于预处理操作，并没有真实的操作DOM，所以叫做虚拟DOM。最后在计算完毕才真正将DOM操作提交，将DOM操作变化反映到DOM树上。