面试题总结
由于各种原因从大连转战到沈阳，开启了找工作面试之路，想转战沈阳的小伙伴请注意，沈阳的软件行业环境大大不如大连，换城市请慎重慎重再慎重，废话不多说，以下内容希望不白写,不喜勿喷。
1.谈谈你对vue的理解
Vue.js是一个用于创建用户界面的开源JavaScript框架，也是一个创建单页面应用的Web应用框架。
Vue在构建用户界面时，能够编写结构 美化样式 处理交互
编写结构：vue提供指令、数据驱动视图构建页面的结构
美化样式：基础css样式即可美化
处理交互：基于vue提供的事件绑定，可轻松处理用户和界面之间的交互行为
vue的核心特性 数据驱动（mvvm） 组件化
vue的优点 轻量级 数据绑定 指令 插件
2.Vue响应式数据
当数据发生改变时，UI页面做出响应 就是响应式
比如Vue中的data被改变时，页面中的就会做出响应
const vm=new Vue({data:{n:0}})
如果修改vm.n，那么UI中的n会响应我
当你把一个普通的 JavaScript 对象传入 Vue 实例作为 data 选项，Vue 将遍历此对象所有的 property，并使用 Object.defineProperty 把这些 property 全部转为 getter/setter。
1.通过getter和setter修改对象属性实现数据响应
2.定义完成的对象通过Object.defineProperty(obj,'n',{value:1})添加属性
但是Object.defineProperty存在一定的问题
1.Vue只会检查第一层属性
2.必须要有‘n’，才能代理和监听obj.n，没有会出现警告
解决办法：
Vue.set(this.obj,'b',1)或者this.$set(this.obj,'b',1)
作用：
1. 新增key
2.自动创建代理和监听
3.触发UI更新
3.给数组添加元素
用 Vue.set(this.array,3,'d')实现数据响应
也可以用this.array.push('d');实现数据响应，这个push是被Vue修改过的
数组变异方式7个
push(),pop(),shift(),unshift(),splice(),sort(),reverse()会自动添加监听和代理，this.$set 作用于数组时，并不会自动添加监听和代理
3.你所理解的MVVM
MVVM它是一种前端开发架构模式，是为了让前端业务逻辑与HTML代码分离开，核心思想就是把每个页面分成M（model数据模型）V（view视图UI组件）VM（viewmodel视图模型），VM是核心，完成MV之间的交互，M和V不直接关联，通过VM并实现数据双向绑定功能。也就是M改变时通过VM V改变，V改变是通过VM改变M.
4.谈一下你对vue指令的理解
vue的指令本质是Vue为HTML标签新增的一些属性
vue的指令有三种
(1)用于渲染数据的有 v-for v-show v-text v-html v-bind 等等
(2)用来交互的有 v-on v-model 等等
(3)自定义的vue属性(自带的指令不足以满足需求是可以通过自定义属性来满足项目对vue指令的需求)
5.怎么封装一个vue的自定义指令
vue中封装自定义指令_小泡泡c的博客-CSDN博客_vue封装自定义指令vue中封装自定义指令https://blog.csdn.net/qq_45325810/article/details/121598884
6.Vue2与vue3的区别，以及发生了哪些变化
一文看懂 Vue3 对比 Vue2 发生哪些变化_油墨香^_^的博客-CSDN博客_vue3相对于vue2有哪些改进整体来看，变化不大，只是名字大部分需要 + ，功能上类似。使用上 Vue3 组合式 API 需要先引入；Vue2 选项 API 则可直接调用，如下所示。常用生命周期表格如下所示。Tips： 是围绕和生命周期钩子运行的，所以不需要显式地去定义。Vue3 支持了多根节点组件，也就是。Vue2中，编写页面的时候，我们需要去将组件包裹在中，否则报错警告。Vue3，我们可以组件包含多个根节点，可以少写一层，niceeee ！异步组件Vue3 提供 组件，允许程序在等待异步组件时渲染兜底的内容，如https://blog.csdn.net/qq_41581588/article/details/125684443
7.Computer的计算属性和watch监听的他们之间的区别
https://www.jianshu.com/p/13053968a24a
https://www.jianshu.com/p/13053968a24a
8.谈一谈响应式数据
响应式数据_笑道三千的博客-CSDN博客_响应式数据响应式，个人理解就是数据a变更，会自动更新所有用到a的地方。即它变更后会自动更新所有依赖于它的地方。具体在vue的代码中有这么几个地方。1，html中渲染展示绑定的数据2，watch和conputed中的依赖项那如何实现自动更新？首先需要能捕获它的变更，这样才可以在它变更的时候，去更新和它相关的地方。1,利用Object.definePropery数据劫持。2，利用Proxy数据代理。3，利用对象的 get 和 set 函数实际上，所谓的响应式数据，就是做到了以下两个事情。https://blog.csdn.net/weixin_42349568/article/details/126708509
9.VNode是什么
VNode是什么？_zayyo的博客-CSDN博客_vnode是什么我们先来解释一下VNode的概念：目前我们先理解HTML元素创建出来的VNode；VNode的全称是Virtual Node，也就是虚拟节点；事实上，无论是组件还是元素，它们最终在Vue中表示出来的都是一个个VNode；Virtual DOM是对DOM的抽象,本质上是JavaScript对象,这个对象就是更加轻量级的对DOM的描述如果我们不只是一个简单的div，而是有一大堆的元素，那么它们应该会形成一个VNode Tree为什么需要Virtual DOM既然我们已经有了DOM,为https://blog.csdn.net/weixin_45215308/article/details/123358081
10.VNode是如何渲染的
？？？
11.Vue生命周期他的执行顺序
创建前/后 挂载前/后 更新前/后 销毁前/后
1.beforeCreate:在实例初始化之后,进行数据侦听和事件/侦听器的配置之前同步调用。(这时还不能使用响应式数据)
2.created:在实例创建完成后被立即同步调用(数据侦听、计算属性、方法等可以使用)
3.beforeMount:在当前组件挂载到DOM开始之前被调用
4.mounted:在当前组件挂载到DOM之后调用
5.beforeUpdate:在数据发生改变后，组件DOM被更新之前被调用
6.updated:在数据更改导致的虚拟 DOM 重新渲染和更新完毕之后被调用
7.beforeDestroy:组件实例销毁之前调用(如v-if隐藏组件)
8.destroyed:组件实例销毁后调用
组件执行的顺序
（父）beforeCreate ——>（父）created ——>（父）beforeMount ——>
（子）beforeCreate ——> （子）created ——> （子）beforeMount ——> （子） mounted ——>（父） mounted
12.谈一谈vuex的核心属性
vuex五大核心属性是：state，getter，mutation，action，module
1、state：存储数据，存储状态；在根组件实例中注册了store 后，用 this.$store.state 来访问；对应vue里面的data；存放数据方式为响应式，vue组件从store中读取数据，如数据发生变化，组件也会对应的更新。
2、getter：可以对state 进行计算操作，它的返回值会根据它的依赖被缓存起来，且只有当它的依赖值发生了改变才会被重新计算。
3、mutation：更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。
4、action：包含任意异步操作，通过提交 mutation 间接更变状态。
5、module：面对复杂的应用程序，当管理的状态比较多时；我们需要将vuex的store对象分割成模块(modules),进行模块化管理
13.Vuex里边机制是怎么运转的
vuex是在vue中的全局状态管理工具，可在任意组件中访问vuex中定义的数据，达到数据全局共享。
在组件中通过dispatch来调用actions中的方法在actions中通过commit来调用mutations中的方法，在mutations中可以直接操作state中的数据，state的数据只要一发生改变立马响应到组件中。
14.谈一谈vuex里边，action mutation和state之间的运转方式
vuex里的state,actions,mutations用法与理解_汤米粥的博客-CSDN博客_actions可以直接修改state吗state里是放定义的全局变量/常量actions是放全局可以调用的函数,修改stae里的变量/常量 但actions里不能直接修改state的变量/常量，里面还是需要通过mutations里定义的函数来修改比如：commit('add', 1); 同时在mutations里有一个add(state,id)方法，其实它就是个“中介”。mutaions放真正修改state属性的方法，可以在我们的vue里直接调用，也可以通过actions来间接调用。...https://blog.csdn.net/nnmmbb/article/details/126540391
15.谈一谈Keep和alive这个组件它的一个实现原理
keep-alive实现原理_m0_65373673的博客-CSDN博客_keep-alive原理1、keep-alive是什么keep-alive是一个抽象组件：它自身不会渲染一个DOM元素，也不会出现在父组件链中；使keep-alive包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。一个场景用户在某个列表页面选择筛选条件过滤出一份数据列表，由列表页面进入数据详情页面，再返回该列表页面，我们希望：列表页面可以保留用户的筛选（或选中）状态。keep-alive就是用来解决这种场景。当然keep-alive不仅仅是能够保存页面/组件的状态这么简单，它还可以避免组件反复创建..https://blog.csdn.net/m0_65373673/article/details/122451687
16.我们如何在vue项目中应用我们的权限
vue项目权限管理实现_苪玫儿呀的博客-CSDN博客_vue权限管理怎么实现1、整体思路后端返回用户权限，前端根据用户权限处理得到左侧菜单；所有路由在前端定义好，根据后端返回的用户权限筛选出需要挂载的路由，然后使用 addRoutes 动态挂载路由。2、具体实现a、创建vue实例的时候将vue-router挂载，但这个时候vue-router挂载一些登录或者不用权限的公用的页面。b、当用户登录后，获取用role，将role和路由表每个页面的需要的权限作比较，生成最终用户可访问的路由表。c、调用router.addRoutes(store.getters.addRhttps://blog.csdn.net/hbmern/article/details/122339061
17.谈一谈vue项目中如何去做我们的导航守卫
vue总结之导航守卫_无人与我粥可温的博客-CSDN博客以上就是今天分享的内容，本文仅仅简单介绍了导航守卫的使用，导航守卫给我们提供了许多便利，在页面跳转前进行操作，跳转后进行初始化等等的操作。https://blog.csdn.net/yjnain3066/article/details/126635810