前端面试之 vue是什么？有什么优点？

一、vue是什么？

Vue.js 是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和 Vue 生态系统支持的库开发的复杂单页应用。
Vue的目标就是通过尽可能简单的api实现响应式的数据绑定和组合的视图组件。

1. 什么是渐进式的框架？
2. 什么是视图层？
3. 单文件组件？和复杂单页应用是什么？
4. 什么是响应式的数据绑定？

且听我细细道来

二、Vue.js到底是什么？

用于搭建表单项繁多，且内容需要根据用户的操作进行修改的网页版应用

三、单页应用程序（single page web application SPA）

在说单页应用程序之前，先说一下 多页面应用程序。多页面（MPA）就是指一个应用中有多个页面，页面跳转时是整页刷新。
单页应用程序是加载单个Html页面并在用户与应用程序交互时动态更新该页面的web应用程序。顾名思义，单页应用一般指的就是一个页面就是一个应用，当然也可以是一个子应用。单页应用程序中一般交互处理非常多，且页面当中的内容需要根据用户的操作进行动态的变化。
单页web应用的优点：

• 提供了更加吸引人的用户体验，具有桌面应用的即时性，网站的可移植性和可可访问性。
• 单页应用的内容改变不需要重新加载整个页面，web更具相应
• 单页应用没有页面之间的切换，就不会出现“白屏”现象，也不会出现假死并且有“闪烁”的现象
• 单页应用相对服务器来说压力较小，服务器只需要出数据就可以，不用管展示逻辑和页面的合成，吞吐能力会提高几倍
• 良好的前后端分离，后端不再负责模板渲染，输出页面工作，后端API通用化
• 完全的前端组件化开发，不再以页面为单位，更多地采用组件化的思想，代码解构和组织方式更加地规范化，便于修改和调整。
  单页web应用的缺点
• 首次加载耗时比较多
• SEO问题，不利于SEO优化，单页页面，数据在前端渲染，就意味着没有SEO
• 容易造成css命名冲突
• 页面的导航不可用，如果一定要导航需要自行实现前进，后退。（由于单页面不能用浏览器的前进后退功能，所以需要自己建立起堆栈管理）

四、什么是渐进式的框架？

渐进式代表的含义是：没有多做职责以外的事情，主张较少，可以根据不同的需求选择不同的层级；
vue.js只提供了vue-cli生态中最核心的组件系统和双向的数据绑定。像vuex、vue-router都属于围绕vue.js开发的库。
比如你要使用Augular，就必须强制接受以下的东西：

• 必须使用它的模块机制

• 必须使用它的依赖注入

• 必须使用它的特使形式定义组件（这一点每个视图框架都有，难以避免）
  so，Augular是带有比较强的排他性，如果你的应用不是从头开始的话，是需要不断地去考虑是否与其他的东西去进行集成，这些主张会带来一些的困扰。
  比如，你要使用react.你必须理解：

• 函数式编程的理念

• 需要明白知道什么是副作用

• 什么是纯函数

• 如何隔离副作用

• 它的入侵性没有angular那么强，主要是因为他是软性侵入
  Vue与React/Angular的不同，他就是渐进式的

• 你可以在原有的系统上面，把一两个组件改用它来实现，当jQuery来用

• 也可以整个用它来进行全家桶开发， 当Augular来用

• 还可以用它的视图，搭配你自己设计的整个下层来用

• 也可以函数式，都可以，他只是个轻量的视图而已，只是做了最核心的东西

五、什么是视图层？

其实把页面抽象出来之后，我们会发现html里面的dom其实就是试图，一个网页其实就是视图的组合和嵌套，形成了最基本的视图结构，再通过css的修饰，然后再到JavaScript来的交互部分，通过接受用户的交互请求与，并且通过事件机制来响应用户的交互操作，并且在事件处理函数中进行各种数据的修改。
我们把html中的dom就可以与其他的部分独立开来划分出一个层次，这个层次就叫做视图层。
而我们的vue的核心库，就是只关注视图层。

六、响应式的数据绑定

vue会自动响应数据的变化情况，并且根据用户在代码中预先写好的绑定关系，对所有绑定在一起的数据和视图内容进行修改，使用v-model属性实现双向的数据绑定。所以，vue.js也被人称为声明式渲染的模版引擎。
Vue.js数据观测原理在技术实现上，利用的是ES5Object.defineProperty和存储器属性：getter和setter（所以只兼容IE9及以上），可称为基于依赖收集的观测机制。核心是VM,即ViewModel，保证数据和视图的一致性。

七、组件

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

八、Vue的优点总结如下

1. 轻量级的框架，只关注视图层，是一个构建数据的视图集合，大小只有几十KB
2. 简单易学，国人开发，中文文档，不存在语言障碍，便于理解和学习
3. 双向数据绑定，在数据操作中较为简单
4. 组件化，用可复用,解耦的组件来构建页面
5. 数据驱动：自动计算属性和追踪依赖的模板表达式
6. 虚拟DOM：DOM操作是十分耗费性能的，不再使用原生的dom操作节点，极大地解放了dom操作，但具体操作还是dom，只不过换了一种方式

参考：https://blog.csdn.net/wxl1555/article/details/79964818

仗剑天涯，从你的努力开始