1 计算属性computed和watch和methods的区别

计算属性和方法确实能达到相同的结果，但是计算属性是基于响应式依赖进行缓存的。只要相关响应式依赖发生变化时他们才重新求值。这就意味着只要依赖没有发生变化，多次访问计算属性会立即返回之前的结果，而不必再次执行函数。相反的每次重新渲染的时候，调用方法总会再次执行

计算属性和watch的区别

计算属性默认首次会触发，计算属性性能较高，因为计算属性是根据依赖进行改变的，依赖没有变化计算属性就会用上一次计算后的缓存立即返回结果。必须在模板渲染的时候调用才生效，一般适合做筛选。watch数据观测默认首次不触发，只有数据发生变化时才会触发。可以不在模板渲染时生效，只是单纯的观测data选项中的一个数据名。一般适合需要在数据变化时执行异步操作或开销过大的操作。

2 生命周期

Vue生命周期分为8个阶段，创建前后，挂载前后，更新前后，销毁前后

beforecreate：Vue的实例VM中$el和data都未初始化，都是undefined。

created：完成了data的初始化，但el还未初始化。

beforemount：完成了data和$el的初始化，进行相关的render函数的首次调用。实例已经完成编译模板，把data里面的数据和模板生成HTML，但没有挂载到真实dom,只是挂在虚拟dom上。

mouted:用上面编译好的HTML内容替换el属性指向的dom对象。完成模板中HTML渲染到HTML页面中。

beforeupdate：在数据更新之前调用，发生在虚拟dom重新渲染和打补丁之前，可以在这个钩子函数里面进一步更改状态，不会触发附加的重新渲染过程。

updatad:在数据更改导致虚拟dom重新渲染和打补丁之后调用。调用的时候组件dom已经更新，所以可以执行依赖于dom的操作。但是应该避免在此状态下更新状态，因为可能造成更新无线循环。

beforedestory:实例销毁之前，实例仍然可用

destoryed:在实例销毁之后调用。调用后，所有的事件监听和子实例也会被销毁。

3 组件通讯

父到子

子组件通过props接收父组件的传值

子组件向父组件通讯

父组件向子组件传递事件方法，子组件通过$emit触发事件，回调给父组件

兄弟组件通讯：

可以实例一个bus作为媒介，要相互通讯的兄弟组件之中，都引入bus，然后通过分别调用bus事件触发和监听来实现通讯和参数传递

4 vuex

vuex就是一个仓库，仓库存放了很多对象，其中state就是数据源存放地，对应一般Vue中的data数据。state里面存放的数据是响应式的，Vue组件从store读取数据，如果store中的数据发生变化，则依赖这些数据的组件也会发生更新。

vuex有5个属性，state，action，mutation,,getter,modual

state:vuex使用单一的状态树，即每个应用仅仅包含一个store。存放的数据状态，不可以直接修改里面的数据。

action：主要是业务处理，异步操作数据。用this.$store.dispatch将函数类型和负载传给mutation

mutation:是同步的，主要是拿到公共数据和负载进行突变

getters:类似Vue中计算属性，主要过滤一些数据

module：由于单一的状态树，应用的所有状态都会集中到一个比较大的对象中。当应用变的比较复杂时，store对象就有可能变得十分臃肿。所以vuex允许将store分割成模块，每个模块都有自己的action，mutation，state，getter

5 双向绑定的原理

主要是采用数据劫持和订阅发布的模式实现的。通过object.defineProperty来劫持各个属性的getter,setter,在数据变动时发布消息给订阅者，触发响应的监听回调。

6 Vue-router的原理

vue-router通过hash与History interface两种方式实现前端路由，更新视图但不重新请求页面”。选择mode类型之后，程序会根据你选择的mode 类型创建不同的history对象(HashHistory或HTML5History或AbstractHistory)。

HashHistory可以通过push和replace来跳转页面，push是向history添加一条记录，浏览器可以前进后退，replace是替换当前路由，并没有向history添加新纪录，所以没有前进和后退。

History interface是浏览器历史记录栈提供的接口，通过back(), forward(), go()等方法，我们可以读取浏览器历史记录栈的信息，进行各种跳转操作。