故心故心故心故心小故冲啊
文章目录 1.说说你对vue的理解?2.说说你对双向绑定的理解?3.Vue中的v-show和v-if怎么理解？4.Vue组件间通信方式都有哪些?5.Vue中的$nextTick怎么理解?6.为什么Vue中的v-if和v-for不建议一起用?7.Vue项目中有封装过axios吗？怎么封装的？8.了解过vue中的diff算法吗？说说看9.Vue实例挂载的过程中发生了什么?10.说说你对keep-alive的理解是什么？怎么缓存当前的组件？缓存后怎么更新？11.说说为什么要在列表组件中写 key，其作用是什么？12.Vue常用的修饰符有哪些?有什么应用场景?13.什么是虚拟DOM？如何实现一个虚拟DOM？14.为什么data属性是一个函数而不是一个对象？15.说说你对Vue生命周期的理解?16.说说对observable的理解17.SPA（单页应用）首屏加载速度慢怎么解决？正在收录中....
1.说说你对vue的理解?
vue是一个用于构建用户界面的开源渐进式框架，也是一个创建单应用页面的Web应用框架.
Vue所关注的核心是MVC模式中的视图层，同时，它也能方便地获取数据更新，并通过组件内部特定的方法实现视图与模型的交互
vue有俩大核心特性
1.数据驱动（MVVM)
MVVM表示的是 Model-View-ViewModel
2.组件化
一句话来说就是把图形、非图形的各种逻辑均抽象为一个统一的概念（组件）来实现开发的模式，在Vue中每一个.vue文件都可以视为一个组件
组件化的优势
详解
2.说说你对双向绑定的理解?用户更新了View，Model的数据也自动被更新了，这种情况就是双向绑定
详解
v-show 与 v-if 的作用效果是相同的(不含v-else)，都能控制元素在页面是否显示
当表达式为true的时候，都会占据页面的位置
当表达式都为false时，都不会占据页面位置
v-show与v-if的区别
1.控制手段不同
控制手段：v-show隐藏则是为该元素添加css–display:none，dom元素依旧还在。v-if显示隐藏是将dom元素整个添加或删除
2.编译过程不同
编译过程：v-if切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听和子组件；v-show只是简单的基于css切换
3.编译条件不同
编译条件：v-if是真正的条件渲染，它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。只有渲染条件为假时，并不做操作，直到为真才渲染
v-show 由false变为true的时候不会触发组件的生命周期
v-if由false变为true的时候，触发组件的beforeCreate、create、beforeMount、mounted钩子，由true变为false的时候触发组件的beforeDestroy、destroyed方法
4.性能消耗不同
性能消耗：v-if有更高的切换消耗；v-show有更高的初始渲染消耗
详解
父子关系的组件数据传递选择 props 与 $emit进行传递，也可选择ref
兄弟关系的组件数据传递可选择$bus，其次可以选择$parent进行传递
祖先与后代组件数据传递可选择attrs与listeners或者 Provide与 Inject
复杂关系的组件数据传递可以通过vuex存放共享的变量
详解
5.Vue中的$nextTick怎么理解?官方对其的定义
在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM
就是说可以立即获取dom更新后的数据进行更新
ps:在dom数据在发现变化的时候，vue并不会立刻去更新Dom，而是将修改数据的操作放在了一个异步操作队列中
如果我们一直修改相同数据，异步操作队列还会进行去重
等待同一事件循环中的所有数据变化完成之后，会将队列中的事件拿来进行处理，进行DOM的更新
详解
v-for优先级比v-if高
v-if 和 v-for 同时用在同一个元素上，带来性能方面的浪费（每次渲染都会先循环再进行条件判断）
详解
7.Vue项目中有封装过axios吗？怎么封装的？请求拦截器 --在请求头中添加token
响应拦截器
详解
diff 算法是一种通过同层的树节点进行比较的高效算法
详解
new Vue的时候调用会调用_init方法
定义 s e t 、 set、set、get 、d e l e t e 、 delete、delete、watch 等方法定义 o n 、 on、on、off、e m i t 、 emit、emit、off等事件定义 _update、f o r c e U p d a t e 、 forceUpdate、forceUpdate、destroy生命周期调用$mount进行页面的挂载挂载的时候主要是通过mountComponent方法定义updateComponent更新函数执行render生成虚拟DOM_update将虚拟DOM生成真实DOM结构，并且渲染到页面中详解
10.说说你对keep-alive的理解是什么？怎么缓存当前的组件？缓存后怎么更新？keep-alive是vue中的内置组件，能在组件切换过程中将状态保留在内存中，防止重复渲染DOM
keep-alive 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们
keep-alive可以设置以下props属性：
include - 字符串或正则表达式。只有名称匹配的组件会被缓存exclude - 字符串或正则表达式。任何名称匹配的组件都不会被缓存max - 数字。最多可以缓存多少组件实例详解
11.说说为什么要在列表组件中写 key，其作用是什么？可见设置key能够大大减少对页面的DOM操作，提高了diff效率
详解
表单修饰符
事件修饰符
鼠标按键修饰符
键值修饰符
v-bind修饰符
详解
虚拟 DOM （Virtual DOM ）这个概念相信大家都不陌生，从 React 到 Vue ，虚拟 DOM 为这两个框架都带来了跨平台的能力（React-Native 和 Weex）
实际上它只是一层对真实DOM的抽象，以JavaScript 对象 (VNode 节点) 作为基础的树，用对象的属性来描述节点，最终可以通过一系列操作使这棵树映射到真实环境上
在Javascript对象中，虚拟DOM 表现为一个 Object对象。并且最少包含标签名 (tag)、属性 (attrs) 和子元素对象 (children) 三个属性，不同框架对这三个属性的名命可能会有差别
创建虚拟DOM就是为了更好将虚拟的节点渲染到页面视图中，所以虚拟DOM对象的节点与真实DOM的属性一一照应
在vue中同样使用到了虚拟DOM技术
详解
根实例对象data可以是对象也可以是函数（根实例是单例），不会产生数据污染情况
组件实例对象data必须为函数，目的是为了防止多个组件实例对象之间共用一个data，产生数据污染。采用函数的形式，initData时会将其作为工厂函数都会返回全新data对象
详解
详解
Vue.observable，让一个对象变成响应式数据。Vue 内部会用它来处理 data 函数返回的对象
详解
详解