vue中常见面试题

布满荆棘的人生 2022-12-17 02:26 24阅读 0赞

vue中面试官口头问答常见的面试题：

问：什么时候页面会重新渲染？  
答：数据发生改变，页面就会重新渲染，但数据驱动视图，数据必须先存在，然后才能实现数据绑定，改变数据，页面才会重新渲染。

问：什么时候页面不会重新渲染？  
答：有3种情况不会重新渲染：  
1、未经声明和未使用的变量，修改他们，都不会重新渲染页面  
2、通过索引的方式和更改长度的方式更改数组，都不会重新渲染页面  
3、增加和删除对象的属性，不会重新渲染页面

问：如何使 未声明/未使用的变量、增加/删除对象属性可以使页面重新渲染？  
答：添加利用 vm. s e t / V U E . s e t ， 删 除 利 用 v m . set/VUE.set，删除利用vm. set/VUE.set，删除利用vm.delete/VUE.delete方法

问：如何更改数组可以使页面重新渲染？  
答：可以使用数组的变异方法（共 7 个）：push、pop、unshift、shift、splice、sort、reverse

问：数据更新后，页面会立刻重新渲染么？  
答：更改数据后，页面不会立刻重新渲染，页面渲染的操作是异步执行的，执行完同步任务后，才会执行异步的  
同步队列，异步队列（宏任务、微任务）

问：如果更改了数据，想要在页面重新渲染后再做操作，怎么办？  
答：可以使用 vm.$nextTick 或 VUE.nextTick。二者都是等页面渲染后执行的任务,都是使用微任务。  
同样的这也是 VUE 的一个小缺点：VUE 一直是等主线程执行完以后再执行渲染任务，如果主线程卡死，则永远渲染不出来。

问：vm. n e x t T i c k 和 V U E . n e x t T i c k 有 什 么 区 别 呢 ？ 答 ： V U E . n e x t T i c k 内 部 函 数 的 t h i s 指 向 W i n d o w ， v m . nextTick 和 VUE.nextTick 有什么区别呢 ？ 答：VUE.nextTick 内部函数的 this 指向 Window，vm. nextTick和VUE.nextTick有什么区别呢？答：VUE.nextTick内部函数的this指向Window，vm.nextTick 内部函数的 this 指向 VUE 实例对象。

问：利用 Object.defineProperty 实现响应式有什么缺点？  
答：  
1、天生就需要进行递归  
2、监听不到数组不存在的索引的改变  
3、监听不到数组长度的改变  
4、监听不到对象的增删

问：请解释一下vuex  
答：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

问：vue的生命周期有几个函数，作用是什么  
答：1. BeforeCreate函数：  
在实例初始化后被调用 ，这个时候的this 不能用，在data中的数据 methods的方法 还有 watcher中的事件 都获取不到  
2.Created函数：  
实例已经创建完成了，实例对象已经完成了，这时候可以访问 data 中的 数据 ，一级 methods中的方法和 watcher 中的事件了，但是 不能操作 dom 节点  
挂载阶段。  
3.Beforemounte：  
在挂载开始前被调用 render函数 第一次被调用  
4.mounted:  
挂载完毕 ，这时候可以使用 dom 节点 ，一些需要dom的操作这时候才可以进行  
5.BeforeUpdate  
组件更新前 也就是说 数据 更新了 但是vue中的组件（事件）对应dom 内部中的数据没有变 所以说叫做组件更新前  
6.Updated  
组件更新完成之后的操作  
ue中的组件（事件）已经对应dom 内部中的数据了  
7.beforeDestroy  
实例销毁之前调用 ，在 这个时候实例还是可以用的  
8.Destroy  
摧毁阶段 vue的 生命周期结束 ，实例 不能用了