1.首先，请谈一下对Vue的理解？

我们都知道Vue是如今比较流行的一个用于创建用户界面的开源JavaScript渐进式框架，也是一个创建单页应用的Web应用框架。它有如下特点：

1）数据驱动：Vue是一个轻量级的框架，它只关注视图层，通过MVVM思想实现数据的双向绑定，数据驱动页面视图。所以开发者不用再操作dom对象，只需去思考业务逻辑。

2）组件化：Vue把一个单页面应用的各种模块拆分成了一个个单独的组件。我们只需对于各个组件进行实际的实现，如果需要使用它，我们就使用标签进行引用。这样可以降低整个系统的耦合度，方便调试以及提高可维护性。

3）单页Web应用（single page application，SPA）：只有一个Web页面的应用，就是所有必要的代码（HTML、JavaScript和CSS）都通过单个页面的加载而检索，或者根据需要（通常是为响应用户操作）动态装载适当的资源并添加到页面。并在用户与应用程序交互时动态更新该页面的Web应用程序。

补充：

a. 单页面应用程序：只有第一次会加载页面, 以后的每次请求， 仅仅是获取必要的数据。然后, 由页面中js解析获取的数据, 展示在页面中。

b. 多页面应用程序：对于传统的多页面应用程序来说，每次请求服务器返回的都是一个完整的页面，即需要重新加载html、css、js文件。

2.上面说Vue是一款渐进式框架，谈一下对渐进式框架的理解？

首先渐进式是Vue的设计理念。Vue.js

最突出的优势在于可以对数据进行双向绑定，也就是声明式渲染。如上图所示，Vue还有组件系统、客户端路由、大规模状态管理、构建工具等完整的功能，他们之间都是相互独立的，我们可以在核心功能上选用其他部件。我们可以理解为只要自己想要部分，只做自己想做的事。

3. 解释一下MVVM（数据驱动）

MVVM 是 Model-View-ViewModel 的缩写。Model代表模型层，负责处理业务逻辑以及和服务器端进行交互；

View代表视图层，它负责将数据模型转化成UI 展现出来；

ViewModel代表视图模型层，用来连接Model和View，是Model和View之间的通信桥梁，监听模型数据的改变和控制视图行为、处理用户交互，简单理解就是一个同步View 和 Model的对象，连接Model和View。DOMListeners和DataBindings是实现双向绑定的关键。DOMListeners监听页面所有View层DOM元素的变化，当发生变化，Model层的数据随之变化；DataBindings监听Model层的数据，当数据发生变化，View层的DOM元素随之变化。如下图：

4. 双向绑定的原理

Vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的。双向数据绑定都是基于Object.defineProperty()重新定义get和set方法实现的。修改触发set方法赋值，获取触发get方法取值，并通过数据劫持发布信息。示例：

1）new Vue()首先执行初始化，对data执行响应化处理，这个过程发生Observe中

2）同时对模板执行编译，找到其中动态绑定的数据，从data中获取并初始化视图，这个过程发生在Compile中

3）同时定义⼀个更新函数和Watcher，将来对应数据变化时Watcher会调用更新函数

4）由于data的某个key在⼀个视图中可能出现多次，所以每个key都需要⼀个管家Dep来管理多个Watcher

5）将来data中数据⼀旦发生变化，会首先找到对应的Dep，通知所有Watcher执行更新函数。

5. Vue组件之间的通信有哪些？

a. 父传子 props；b. 子传父 $emit；c. Vuex 状态管理器（详情见此文）

6. 对Vue指令的理解

vue一共为我们提供了14种内置指令：v-text  v-html  v-show  v-ifv-elsev-else-ifv-forv-on  v-bind  v-model  v-slot  v-pre  v-cloak  v-once。它们作用于HTML元素，指令提供了一些特殊的特性，将指令绑定在元素上时，指令会为绑定的目标元素添加一些特殊的行为，我们可以将指令看作特殊的HTML特性（attribute）。指令的本质就是语法糖或者说是标志位，目的是为了操作DOM，将操作DOM的逻辑封装成指令（简化代码量），然后交给编译器，最后生成js代码来渲染我们的页面。

7.v-show和v-if、v-bind 和v-on 指令的区别

它们都是控制元素的显示和隐藏。但是实现本质方法不同，

v-show本质就是通过控制css中的display设置为none，控制隐藏，只会编译一次；不管初始条件是什么，元素总是会被渲染，并且只是简单地基于 CSS 进行切换。

v-if是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-if是动态的向DOM树内添加或者删除DOM元素。v-if也是惰性的：如果在初始渲染时条件为假，则什么也不做——直到条件第一次变为真时，才会开始渲染条件块。

而且v-if不停的销毁和创建比较消耗性能。如果要频繁切换某节点，使用v-show(切换开销比较小，初始开销较大)。如果不需要频繁切换某节点使用v-if（初始渲染开销较小，切换开销比较大）。

v-bind 绑定用来将html标签中相关属性绑定到vue实例中，日后通过对vue实例中数据改变，影响到对应标签中属性值变化。

v-on 指令用于绑定HTML事件。

8. 简述computed和watch的区别

答：computed:是计算属性。为了应对复杂的逻辑计算。有缓存，只有当缓存改变时才执行（即只执行一遍getter）。当一个属性受多个属性影响的时候就需要用到computed。例如：购物车商品总价结算。

watch:是侦听属性。对数据的变化作出反应，没有缓存，从新渲染就会执行。当一条数据影响多条数据的时候就需要用watch。例如：搜索数据。

9. 简述Vue的生命周期。