vue 前端常见面试题

一、MVC 和 MVVM 区别？

VC

MVC 全名是 Model View Controller，是模型(model)－视图(view)－控制器(controller)的缩写，一种软件设计典范

Model（模型）：是应用程序中用于处理应用程序数据逻辑的部分。通常模型对象负责在数据库中存取数据
View（视图）：是应用程序中处理数据显示的部分。通常视图是依据模型数据创建的
Controller（控制器）：是应用程序中处理用户交互的部分。通常控制器负责从视图读取数据，控制用户输入，并向模型发送数据
MVC 的思想：一句话描述就是 Controller 负责将 Model 的数据用 View 显示出来，换句话说就是在 Controller 里面把 Model 的数据赋值给 View。

MVVM

MVVM 新增了 VM 类

ViewModel 层：做了两件事达到了数据的双向绑定 一是将【模型】转化成【视图】，即将后端传递的数据转化成所看到的页面。实现的方式是：数据绑定。二是将【视图】转化成【模型】，即将所看到的页面转化成后端的数据。实现的方式是：DOM 事件监听。
MVVM 与 MVC 最大的区别就是：它实现了 View 和 Model 的自动同步，也就是当 Model 的属性改变时，我们不用再自己手动操作 Dom 元素，来改变 View 的显示，而是改变属性后该属性对应 View 层显示会自动改变（对应Vue数据驱动的思想）

整体看来，MVVM 比 MVC 精简很多，不仅简化了业务与界面的依赖，还解决了数据频繁更新的问题，不用再用选择器操作 DOM 元素。因为在 MVVM 中，View 不知道 Model 的存在，Model 和 ViewModel 也观察不到 View，这种低耦合模式提高代码的可重用性

二、methods,computed,与watch的区别是什么？

 methods只有主动调用才会执行，返回值可有可无

  computed当依赖的属性值（可以是多个属性）中任何一个发生改变就会触发调用，且存在缓存机制，有返回值

  watch只能监听一个属性，监听的值发生改变就会被调用，watch可以在数据变化时做一些异步处理或者开销大的操作，没有返回值

三、介绍一下Vue的生命周期

 每一个vue实例从创建到销毁的过程，就是这个vue实例的生命周期。在这个过程中，他经历了从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程。

将要创建 ===>调用beforeCreate函数
创建完毕 ===>调用created函数
将要挂载 ===>调用beforeMount函数
挂载完毕 ===>调用mounted函数
将要更新 ===>调用beforeUpdate函数
更新完毕 ===>调用updated函数
将要销毁 ===>调用beforeDestory函数
销毁完毕 ===>调用destroyed函数

四、vue生命周期的作用是什么?

Vue生命周期中有多个事件钩子，让我们在控制整个Vue实例过程时更容易形成好的逻辑。 

五、组件之间是怎么通信的

组件之间通信主要分为三种：父子传参，子父传参，兄弟传参。

父子传参：父组件通过自定义属性的方式传参，通过props属性给子组件传参，子组件通过props属性去接收参数。
子父传参：子组件通过自定义事件的方式传参，通过$emit去进行传参。

六、Vue 路由跳转的几种方式

第一种方式：router-link （声明式路由）
第二种方式：router.push(编程式路由)
第三种方式：this.$router.push() (函数里面调用)
第四种方式：this.$router.replace() (用法同上,push)
第五种方式：this.$router.go(n) 

七、params和query的区别

 ⽤法：query要⽤path来引⼊，params要⽤name来引⼊，接收参数都是类似的，分别是this. $router.query.name 和 this.$router.params.name。url地址显⽰：query更加类似于我们ajax中get传参，params则类似于post，说的再简单⼀点，前者在浏览器地址栏中显⽰参数，后者则不显⽰
        注意点：query刷新不会丢失query⾥⾯的数据params刷新会丢失params⾥⾯的数据

八、v-show和v-if区别的区别：

v-show通过css display控制显示和隐藏，v-if组件真正的渲染和销毁，而不是显示和隐藏，频繁切换状态使用v-show 否则v-if

九、vue页面级组件之间传值?

   1.使用vue-router通过跳转链接带参数传参。
    2.使用本地缓存localStorge。
    3.使用vuex数据管理传值

十、== 和 = = =的区别，什么情况下用相等= =

”==” 是判断转换后的值是否相等, 

”===” 是判断值及类型是否完全相等

不需要判断类型时可以使用==