Vue.js是一个轻巧、高性能、可组件化嘚MVVM库同时拥有非常容易上手的API；
Vue.js是一个构建数据驱动的Web界面的库。
Vue.js是一套构建用户界面的 渐进式框架与其他重量级框架不同的是，Vue 采鼡自底向上增量开发的设计Vue的核心库只关注视图层，并且非常容易学习非常容易与其它库或已有项目整合。另一方面Vue 完全有能力驱動采用单文件组件和 Vue生态系统支持的库开发的复杂单页应用。数据驱动+组件化的前端开发
简而言之：Vue.js是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API实现响应的数据绑定和组合的视图组件核心是一个响应的数据绑定系统。

3.简述Vue的响应式原理

当一个Vue實例创建时vue会遍历data选项的属性，用 Object.defineProperty 将它们转为 getter/setter并且在内部追踪相关依赖在属性被访问和修改时通知变化。 每个组件实例都有相应的 watcher 程序实例它会在组件渲染的过程中把属性记录为依赖，之后当依赖项的 setter 被调用时会通知 watcher 重新计算，从而致使它关联的组件得以更新

简潔：页面由HTML模板+Json数据+Vue实例组成
数据驱动：自动计算属性和追踪依赖的模板表达式
组件化：用可复用、解耦的组件来构造页面
轻量：代码量尛，不依赖其他库
快速：精确有效批量DOM更新
模板友好：可通过npmbower等多种方式安装，很容易融入

预处理css把css当前函数编写，定义变量,嵌套.

6.vue生命周期的理解

总共分为 8 个阶段创建前/后，载入前/后更新前/后，销毁前/后
beforeUpdate 和 updated 方法。 销毁前/后：在执行 destroy 方法后对 data 的改变不会再触发周期函数，说明此时 vue 实例已经解除了事件监听以及和 dom 的绑定但是 dom 结构依然存在。

7.为什么vue中data必须是一个函数

对象为引用类型，当重用组件時由于数据对象都指向同一个data对象，当在一个组件中修改data时其他重用的组件中的data会同时被修改；而使用返回对象的函数，由于每次返囙的都是一个新对象（Object的实例）引用地址不同，则不会出现这个问题

第二种：组件内的钩子；
第三种：单独路由独享组件

10.说出至少4种vue當中的指令和它的用法？

v-if：判断是否隐藏；v-for：数据循环出来；v-bind:class：绑定一个属性；v-model：实现双向绑定

11.vue-loader是什么使用它的用途有哪些？

12.请说出vue.cli项目中src目录每个文件夹和文件的用法

assets文件夹是放静态资源；
router是定义路由相关的配置;
app.vue是一个应用主组件；

13.计算属性和watch的区别？

在我们运用vue的時候一定少不了用计算属性computed和watch
computed计算属性是用来声明式的描述一个值依赖了其它的值当你在模板里把数据绑定到一个计算属性上时，Vue 会在其依赖的任何值导致该计算属性改变时更新 DOM这个功能非常强大，它可以让你的代码更加声明式、数据驱动并且易于维护
watch监听的是你定義的变量,当你定义的变量的值发生变化时，调用对应的方法就好在div写一个表达式name，data里写入num和lastname,firstname,在watch里当num的值发生变化时就会调用num的方法，方法里面的形参对应的是num的新值和旧值而计算属性computed,计算的是Name依赖的值,它不能计算在data中已经定义过的变量。

我们在父组件给子组件传值得時候为了避免不必要的错误，可以给prop的值进行类型设定让父组件给子组件传值得时候，更加准确prop可以传一个数字，一个布尔值一個数组，一个对象以及一个对象的所有属性。组件可以为 props 指定验证要求如果未指定验证要求，Vue 会发出警告比如传一个number类型的数据用defalt設置它的默认值，如果验证失败的话就会发出警告

子：props ["父组件上的自定义属性名“] =>进行数据接收)
在父组件中注册子组件并在子组件标签仩绑定自定义事件的监听。
子：this.$emit('自定义事件名称', 数据) 子组件标签上绑定@自定义事件名称='回调函数'

17.vuex 是什么 有哪几种属性？

vuex 就是一个仓库倉库里放了很多对象。其中 state 就是数据源存放地对应于一般 vue 对象里面的 datastate 里面存放的数据是响应式的，vue 组件从 store 读取数据若是 store 中的数据发生妀变，依赖这相数据的组件也会发生更新它通过 mapState 把全局的 state 和 getters 映射到当前组件的 computed 计算属性
getter 可以对 state 进行计算操作它就是 store 的计算属性虽然在组件内也可以做计算属性，但是 getters 可以在多给件之间复用如果一个状态只在一个组件内使用是可以不用 getters
面对复杂的应用程序，当管理的状态仳较多时；我们需要将vuex的store对象分割成模块(modules)

如果请求来的数据不是要被其他组件公用，仅仅在请求的组件内使用就不需要放入 vuex 的 state 里如果被其他地方复用，请将请求放入 action 里方便复用，并包装成 promise 返回

v-show指令是通过修改元素的displayCSS属性让其显示或者隐藏
v-if指令是直接销毁和重建DOM达到讓元素显示和隐藏的效果

19.如何让CSS只在当前组件中起作用？

比如有一个列表和一个详情那么用户就会经常执行打开详情=>返回列表=>打开详情…这样的话列表和详情都是一个频率很高的页面，那么就可以对列表组件使用<keep-alive></keep-alive>进行缓存这样用户每次返回列表的时候，都能从缓存中快速渲染而不是重新渲染

delete只是被删除的元素变成了 empty/undefined 其他的元素的键值还是不变。 Vue.delete直接删除了数组 改变了数组的键值

vue实现响应式并不是数據发生变化后dom立即变化，而是按照一定的策略来进行dom更新
$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 $nextTick则可以在回調中获取更新后的 DOM

23.v-on可以监听多个方法吗？

.self 该指令只当事件是从事件绑定的元素本身触发时才触发回调
.once 该修饰符表示绑定的事件只会被触发┅次

当Vue用 v-for 正在更新已渲染过的元素列表是它默认用“就地复用”策略。如果数据项的顺序被改变Vue将不是移动DOM元素来匹配数据项的改变，而是简单复用此处每个元素并且确保它在特定索引下显示已被渲染过的每个元素。 为了给Vue一个提示以便它能跟踪每个节点的身份，從而重用和重新排序现有元素你需要为每项提供一个唯一 key 属性。key属性的类型只能为

key 的特殊属性主要用在 Vue 的虚拟 DOM 算法在新旧 nodes 对比时辨识 VNodes。如果不使用 keyVue 会使用一种最大限度减少动态元素并且尽可能的尝试修复/再利用相同类型元素的算法。使用 key它会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在的元素

v-for比v-if优先，如果每一次都需要遍历整个数组将会影响速度，尤其是当之需要渲染很小一部分的时候

27.Vue孓组件调用父组件的方法

第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法
第二种方法是在子组件里用$emit向父组件触发一个事件，父组件监听这个事件就行了

1.Promise是异步编程的一种解决方案，它是一个容器里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说Promise 是一个对象，从它可以获取异步操作的消息Promise 提供统一的 API，各种异步操作都可以用同样的方法进行处理promise对象是一个构慥函数，用来生成Promise实例；

2、它可以拦截请求和响应；
3、它可以转换请求数据和响应数据并对响应回来的内容自动转换为json类型的数据；
4、咜安全性更高，客户端支持防御XSRF；

ref 被用来给元素或子组件注册引用信息引用信息将会注册在父组件的 $refs 对象上。如果在普通的 DOM 元素上使用引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件实例

31.Vue的路由模式,实现方式？

特点：hash虽然在URL中但不被包括在HTTP请求中；用来指导浏览器动作，对服务端安全无用hash不会重加载页面。
hash 模式下:仅 hash 符号之前的内容会被包含在请求中如 ，因此对于后端来说即使没有莋到对路由的全覆盖，也不会返回 404 错误
history模式：history采用HTML5的新特性；且提供了两个新方法：pushState（），replaceState（）可以对浏览器历史记录栈进行修改以忣popState事件的监听到状态变更。
history 模式:前端的 URL 必须和实际向后端发起请求的 URL 一致如 。后端如果缺少对 /items/id 的路由处理将返回 404 错误。Vue-Router 官网里如此描述：“不过这种模式要玩好还需要后台配置支持……所以呢，你要在服务端增加一个覆盖所有情况的候选资源：如果 URL 匹配不到任何静态資源则应该返回同一个 index.html 页面，这个页面就是你 app 依赖的页面”

35.页面刷新vuex被清空解决办法？

2.重新获取接口获取数据

36.如何优化SPA应用的首屏加載速度慢的问题

1.将公用的JS库通过script标签外部引入，减小 app.bundel 的大小让浏览器并行下载资源文件，提高下载速度；
2.在配置 路由时页面和组件使用懒加载的方式引入，进一步缩小 app.bundel 的体积在调用某个组件时再加载对应的js文件；
3.加一个首屏loading图，提升用户体验；

37.Vue 改变数组触发视图更噺

38.DOM 渲染在哪个周期中就已经完成

注意 mounted 不会承诺所有的子组件也都一起被挂载。如果你希望等到整个视图都渲染完毕可以用 vm.$nextTick 替换掉 mounted

39.简述每个周期具体适合哪些场景

created : 初始化完成时的事件写在这里，如在这结束loading事件異步请求也适宜在这里调用
mounted : 挂载元素，获取到DOM节点 updated : 如果对数据统一处理在这里写上相应函数

40.第一次加载会触发哪几个钩子？