vue面试题

一、vue使用的是什么模式？请具体介绍一下这种模式

1.1渐进式开发，采用mvvm的模式
1.2model (模型层) axios data vuex(state)

1.2view (视图层) template < template>< /template>
1.3viewmodel（传递者）是双向绑定实现的机制

1.4渐进式：先使用Vue的核心库，再根据你需要的功能去增加加相应的插件。（没有多做职责之外的事。）

二、数据渲染 有几种方式 有什么区别？

{{}} == 等同于v-text
v-html:v-html可以渲染HTML代码
v-text 不可以渲染HTML代码

三、MVC和MVVM有什么区别

M：model，模型层。

V：view，视图层。

C：controller，控制层

M：model，模型层。。

V：view，视图层。

VM：视图模型层，用来连接Model和View，是Model和View之间的通信桥梁，实现数据双向绑定关键

MVVM实现了数据驱动视图和数据的双向绑定。

三、什么是虚拟dom

虚拟dom就是用js生成的dom对象、因为不是真实的dom、所以称为虚拟dom

虚拟dom原理流程
 用 js对象模拟真实 DOM 树，对真实 DOM 进行抽象；
 diff 算法 —将前后两个模块进行差异对比；
 pach 算法 — 将两个虚拟 DOM 对象的差异应用到真正的 DOM 树。

虚拟dom好处
具备跨平台的优势：虚拟dom是以 js对象为基础而不依赖真实平台环境，所以使它具有了跨平台的能力
提高效率：DOM操作运行慢，用js运行效率高。把DOM操作放在JS层，运用patching算法来计算出真正需要更新的节点，最大限度地减少DOM操作，提高性能。
提升渲染性能：虚拟DOM的优势不在于单次的操作，而是在大量、频繁的数据更新下，能够对视图进行合理、高效的更新

四、vue2和vue3的区别

1.生命周期钩子函数不同
beforecreated在vue3中变成setup()
created 在vue3中变成setup()
beforeMount在vue3中变成了onBeforeMount
mounted在vue3中变成了onMounted

2.数据的双向绑定原理不同 
vue2中数据双向绑定使用的是object.defineproperty
vue3中数据双向绑定是 proxy 通过proxy监听数据的变化

3.是否支持碎片
vue3支持碎片，就是组件内可以拥有多个根节点

4.数据和方法的定义
Vue2使⽤的是选项类型API 
Vue3使⽤的是组合式API

5.API类型不同
vue2中分割了不同的属性: data,computed属性，methods，等等。
vue3当内部有异步函数，需要使用到await的时候，可以直接使用，不需要在setup前面加async

6.父子之间传参不同

7.main.js文件中部分设置不一样

五、vue里面的对this详解
在Vue所有的生命周期钩子方法（如created，mounted， updated以及destroyed）里使用this，this指向调用它的Vue实例 ，也就是 new Vue() ---- 每一个点vue后缀的文件都是利用vue的构造函数模板创建的实例 / 新对象

六、call、appl、bind的区别

call可以调用函数，call第一个参数是改变后this指向的对象，第二个参数是传参
apply可以调用函数，apply第一个参数是改变后this指向的对象，第二个参数是传参，数组传参
bind不会调用函数，其他和call是一样的

7.$nextTick和mounted有什么区别

mounted在生命周期里面只可以执行一次，所有无法获取页面更新后的内容
$nextTick是可以多次执行的

8.undefined和null相等吗

==相等 ===不相等

9.怎么理解vue的单向数据流、

Vue的单向数据流指的是，数据在父组件中被定义和更新，然后通过props的形式传递给子组件，子组件可以读取这些props，但不能直接修改它们。如果子组件需要修改这些数据，需要通过$emit方法将事件发送给父组件，由父组件来更新数据。

10.vue中怎么获取组件中的实例

1.使用ref绑定在组件标签上面
获取的话就是this.$refs.Helloword
2.this.$children 不需要绑定ref了  返回的是一个数组 需要那个组件的实例就this.$children[下标]

子组件获取父组件的实例
this.$parent

11. vue同步更新还是异步更新

Vue 是异步更新的，当数据发生变化时，vue会将更新操作放到一个队列中，然后通过异步的方式去执行更新，这样的好处就是可以将多个数据变化合并成一个更新操作，提高性能

12.vue中的数组或者是数组对象发生改变视图没有更新是怎么回事

vue中就是，只有data的初始化数据才是响应的，vue不能检测到对象属性的添加或删除，没有在data里面声明的是不响应的

13.父传子数据在creater里面可以访问，但是视图不会更新

​​​​​可以是使用watch或者就是computed，在父组件绑定数据，响应式变量更改为那个computed的函数名字，计算属性会根据依赖的数据自动更新，从而保证子组件能够获取到最新的数据