Vue面试题（个人总结版吖）

1、简述MVVM和MVC

MVC: Model（模型） View（视图） Controller（控制器） 简单的理解：视图请求数据，将请求发送至控制器，控制器再将请求发送给模型，模型去查找数据，找到之后传给控制器，控制器再传给视图进行渲染。

MVP：

全称：Model-View-Presenter ；MVP 是从经典的模式MVC演变而来，它们的基本思想有相通的地方Controller/Presenter负责逻辑的处理，Model提供数据，View负责显示。

MVVMA Model 代表数据模型 View 代表UI视图 ViewModel 负责监听 Model 中数据的改变并且控制视图的更新(桥梁，可以理解成mvc中的控制器) 简单理解：视图请求数据，将请求发送至控制器，在控制器的两端具有监听机制，直接调用模型的数据，一端改变全部改变，利用数据劫持，结合订阅者和发布者模式，实现数据的双向绑定

2、简述虚拟DOM和diff算法

虚拟dom是利用js描述元素与元素的关系。 好处：是可以快速的渲染和高效的更新元素，提高浏览器的性能

diff算法

优点：最终表现在DOM上的修改只是部分的变更，可以保证高效的渲染，提高网页的性能

缺点：首次渲染大量DOM时，由于多了一层虚拟DOM的计算，会比innerHtml慢一点

3、怎么创建vue的实例

  new Vue({
       el: "#app",
       data:{
 ​
       },
       methods:{
 ​
       }
  })

4、列举常用指令以及作用· v-html 解析输出变量 能解析html ​ v-text 解析输出变量 ​ v-bind 给标签绑定属性 可以简写为 :属性名=“变量” ​ v-on 给元素绑定事件 用法 v-on:事件名=“方法名” 可以简写为@事件名=“方法” ​ v-pre 跨过当前的标签不解析 用法 ：<标签 v-pre></标签> ​ v-cloak 解决差值表达式闪烁的问题 ​ v-model 实现数据的双向绑定 只能适用于表单元素 ​ v-for 可以循环遍历数据 ​ v-if 条件输出 ​ v-show条件输出

5、列举出常用的修饰符 .stop 阻止事件冒泡 .capture 设置事件捕获 .self 只有当事件作用在元素本身才会触发 .prevent 阻止默认事件，比如超链接跳转 .once 事件只能触发一次 .keyup.enter .keyup.space 6、v-if和v-show的区别及使用场景

区别： 1、当条件为真的时候 没有区别 当条件为假的时候 v-if是不创建元素 v-show 渲染元素然后隐藏掉 2、v-if更适合数据的筛选和初始渲染 v-show更适合元素的切换

7、vue怎么绑定事件？以及常用的事件修饰符

绑定： v-bind:属性名=“变量” ：属性名=“变量”

语法：@事件名.修饰符=“方法名” .stop 阻止事件冒泡 .capture -事件捕获 .self 只是监听触发改元素的事件 .once - 只触发一次 .prevent - 阻止默认事件

8、methods computed watch的区别

computed具有缓存性，依赖于属性值，只有属性发生改变的时候才会重新调用 methods是没有缓存的，只要调用，就会执行 watch没有缓存性 监听属性 属性值只要发生变化就会执行 可以利用他的特性做一些异步的操作

9、vue中怎么动态的绑定class样式

<标签 v-bind:class="{类名:变量}">

10、什么是过滤器？怎么定义全局和局部过滤器

过滤器是实现变量的格式化输出 。过滤器分为局部过滤器还有全局过滤器 全局过滤器 是在多个实例中可以使用的过滤器 语法： Vue.filter(“名”，function(value){ // value是调用过滤器的属性的值 }) 调用： 在v-bind中或者{ { 属性|过滤器名}}

局部过滤器 只是在当前的组件或者实例中使用 filters:{ 名：function(val){ </