前端面试vue篇

1.vue中常见的指令
  - v-for
  - v-if
  - v-show
  - v-bind
  - v-on
  - v-else
  - v-else-if
  - v-model
  - v-html
  - v-text
  - v-once
  - v-slot
  - v-pre

2. v-if和v-show的区别和场景，v-html和v-text的区别

3. vue生命周期
        初始化事件，生命周期
  beforeCreate
        注入数据，初始化响应式数据
  cteated
        是否有el和template选项
  beforeMount
        将数据挂载到模板中，将虚拟DOM转成真实dom
  mounted
        数据改变时触发，dom的更新前后
  beforeUpdate
  updated
        组件销毁的时候触发
  beforeDestroy
  destroyed

  activated
        缓存组件被激活时调用
  deactivated
        缓存组件被停用时调用

  errorCaptured
        子孙组件出错时调用

4. 计算属性，方法，侦听器的区别

5. 描述一下插槽，过滤器和混入

6. 什么是前端路由，传统的路由实现？

7. vue-router
  - vue路由有哪几种模式，有什么区别
  - 什么是嵌套路由，动态路由和路由重定向
  - 路由传参怎么做？
    - 通过动态路由做
  - 描述一下路由守卫

8. 描述一下vuex（从下面几个方向回答）
  - 是做什么的？
  - 有哪几个部分
  - 每个部分都做什么
  - 状态的流向（流程图）
  - 辅助函数

9. 组件传参怎么做
  - 父子传参
  - 非父子传参

10.vue响应式原理
  vue是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的getter，setter，当属性发生改变的时候，将变动发布给订阅者，触发监听回调
  由于 JavaScript 的限制，Vue 不能检测数组和对象的变化

  vue3.0使用了proxy

11.为什么要使用虚拟DOM
  - 虚拟DOM是为了解决浏览器性能问题而被设计出来的。
  - 比如有10次循环，虚拟DOM不会立即操作DOM，而是将10次的diff内容保存在一个js对象里面，然后一次性的操作，避免大量无谓的计算
  - 操作内存中的js对象的速度显然更快，等更新完后，再将最终的js对象映射成真实的DOM，交由浏览器绘制。

12. diff操作
  数据改变，虚拟DOM也会改变
  我们不想重新渲染vdom，我们只想渲染改变的部分，就需要用到diff算法
  两个树如果完全比较，时间复杂度是O(n^3),Vue的Diff算法的时间复杂度是O(n),意味着只能平层的比较两棵树的节点，放弃了深度遍历。似乎牺牲了一定的精准性来换取速度，但考虑到前端页面通常不会跨层移动DOM元素，这样做是优先的
  ```
    采用了同级比较，只有count相同的children进行比较
    比较他们的key，进行增加，删除，替换，换位等操作
  ```