个人想出的面试题，记录下，并按按照自身的理解回答下，持续项
-
v-if和v-show的区别？
- 都是控制组件的展示和消失
- v-show时控制元素的display值来让元素显示和隐藏；v-if显示隐藏时把DOM元素整个添加和删除
- 有一个局部编译/卸载的过程，切换这个过程中会适当的销毁和重建内部的事件监听和子组件；v-show只是简单的css切换
- v-if才是真正的条件渲染；v-show从false变成true的时候不会触发组件的声明周期，v-if会触发声明周期(Update)
- v-if的切换效率比较低 v-show的效率比较高
-
如何理解MVVM的？
- Model - View - ViewModel组合式
- 实现数据和视图的分离
- 通过数据来驱动视图，开发者只需要关心数据变化，DOM操作被封装了
-
v-for中的key值的作用是什么？
- 用于虚拟Dom打上Key方便Diff算法的比较，当不填入会默认判断为null会造成render的时候混乱
-
说一下你对vue生命周期的理解。
- 在不设置keep-alive是八个阶段beforeCreate/ Create/BeforeMouted/Mounted/BeforeUpdate/xxxx
- 在设置keep-alive增加两个阶段 activated/ deactivated
- 最简单的判断方便就是在 beforeCreate / Create / BeforeMouted / Mounted 同时打上data我们可以直观的看到结果：undefined undefined / undefined this.data / undefined this.data / this.element this.data
-
在created和mounted去请求数据，有什么区别？
- 请问数据因为是异步所以无论在哪个阶段都是可以拿到数据的
- 但是有子组建的组建生命周期在mounted阶段之前会走完子组建的前四步所以看业务上的方式
-
vue中的修饰符有哪些？*
.stop.prevent.capture.self.once.passive
-
elementui是怎么做表单验证的？
-
vue如何进行组件通信？
- props/emits
- inject/project
- parent/child
- vuex
- listeners
-
keep-alive是什么？怎么使用？
- 目的是为了做组建缓存
- 主要体现在生命周期再次进入打上keep-alive的组建他是不进入传统的四个生命周期函数，而是走上activated
-
vue路由时怎么传参的？
- query
- parmas
- :id?
-
vue路由的hash模式和history模式有什么区别？
- 在url中的体现 hash带# history不带
- 遇到404情况，hash是不会像服务端发送请求
- 实现方式也是不同 hash是通过监听url hashChange事件，而history是通过history.pushState方法在监听popstate方法
-
说一下vue的动态路由。
- import()动态加载，return 函数在route切换到加载函数，return static资源，这种打包方式，router文件会打包成独立的js
-
如何解决刷新后二次加载路由？
- router.matcher
-
vuex刷新数据会丢失吗？怎么解决？
- 在根dom节点做一些数据处理这样保证在刷新的过程得到新的数据
-
computed和watch的区别？
相同点:
-
计算属性和监听属性以及组件实例, 本质上都是一个Watcher实例.只是行为不同.
-
计算属性和监听属性对于新值与旧值一样的赋值操作, 都不会做任何变化. 但这点的实现是由响应式系统完成的
不同点:
-
计算属性具有"懒计算"功能, 只有依赖的值变化了, 才允许重新计算. 称为"缓存", 个人觉得不准确
-
在数据更新时, 计算属性的dirty状态会立即改变, 而监听属性与组件重新渲染, 至少都会在下一个"tick"执行.
-
-
vuex在什么场景会去使用？属性有哪些？
- 属性： state/getter/moutation/action
- 个人理解的话纯组建通信之间通信比较重的项目
-
vue的双向数据绑定原理是什么？
- Vue2 通过Object.definePortype 劫持Object，通过Get /Set 增加Dep操作，触发 Watch()
- Vue3 通过Proxy引用类型，同时也是具有get/set方法
-
了解diff算法和虚拟DOM吗？
- Diff对比 接受两个参数，一个是(oldNode, newNode)首先判断oldNode是不是虚拟dom，将oldNode全部转化为虚拟dom，如果Tag/Key不同直接插入虚拟Dom同时直接删除Node
- 虚拟Dom通过函数来创建Dom, h(element, Obejct, Obejct)
-
vue和jquery的区别是什么？
- vue更注重数据驱动，jq更多直观的操作dom
- 操作思想不同，vue未来更多是做一个工程化。jq单纯的作为一个js文件引用
-
vue3和vue2有哪些区别？
- 首先响应式原理不同
- DIFF算法的不同
-
vue的性能优化怎么做？
- js层面不操作dom，防止出现重绘和重构
- v-for绑定事件的时候最好的是用事件代理
- 拆分组建
- key的使用，作为diff算法中比较重要的值
- 合理的使用路由懒加载
- 部分静态资源不打入项目直接走cdn
- happypack多线程的大包
-
首屏优化该如何去做？
- 骨架屏概念的引入
- ssr
-
vue3的性能为什么比vue2好？
- 响应式的原理，proxy首先对array/object的支持，以及不用递归key
- diff算法
- vue2在diff算法节点对比玩返回patch对象来存粗节点不同的地方
- vue3 初始化的时候虚拟节点会增加一个patchFlags，只对比patchFlags更新view,不变的直接引用，也就是绑定ref/reactive的dom节点增加flags
-
vue3为什么使用proxy？
- 更快更高效
