跳到主要内容

Vue

2024年03月04日
柏拉文
越努力，越幸运

一、框架原理​

1.1 什么是 MVVM?​

Vue 2.0 MVVM

Vue 3.0 MVVM

1.2 Vue 响应式原理​

Vue 2.0 响应式原理

Vue 3.0 响应式原理

1.3 Vue 双向数据绑定​

Vue 2.0 双向数据绑定

Vue 3.0 双向数据绑定

1.4 Vue 挂载更新流程​

Vue 2.0 挂载更新流程

Vue 3.0 挂载更新流程

1.5 new Vue() 初始化过程​

1.6 createApp() 初始化过程​

1.7 v-model 实现原理​

1.8 v-model 是如何解析的?​

1.9 Vue 组件是异步渲染的？​

1.10 Vue3.0 自定义 v-model​

1.11 手写 Vue3.0 基本的 effect​

1.12 手写 Vue3.0 基本的 reactive​

1.13 Vue 组件是如何渲染和更新的?​

1.14 监听 data 变化的核心 API 是什么?​

1.15 Vue2 通过数组下标更改数组视图为什么不会更新​

1.16 动态给 Vue 的 data 添加一个新的属性时会发生什么? 怎样解决?​

二、核心API​

2.3 app.use 原理?​

2.4 如何编写一个 Vue 插件?​

2.5 computed 和 watch 实现原理?​

Vue3.0 watch 实现原理

Vue3.0 computed 实现原理

2.6 Vue 中 Keep-Alive 作用是什么? 怎么实现的 ？ 如何刷新的?​

2.7 Vue 组件 data 定义函数与对象的区别​

2.8 v-if 和 v-for 的优先级是什么?​

2.9 v-show 和 v-if 有什么区别? 使用场景分别是什么?​

2.10 Vue 常用的修饰符有哪些？有哪些应用场景?​

2.11 如何自定义一个指令？​

2.12 computed vs methods vs watch?​

2.13 provide / inject 是如何实现的?​

2.14 $on、$emit 是如何实现的? 如何解决项目中 $on、$emit 过多的问题（根据 VsCode 源码）?​

2.15 如何理解 ref toRef 和 toRefs ?​

2.16 toRef 和 toRefs 如何使用?​

2.17 ref toRef 和 toRefs 的最佳使用方式?​

2.18 为什么需要用 ref ?​

2.19 为何 ref 需要 value 属性?​

2.20 为什么需要 toRef 和 toRefs ?​

2.22 setup 中如何获取组件实例?​

2.23 Vue3-script-setup-属性和事件?​

2.24 Vue3-script-setup-暴露组件信息 defineExpose?​

2.25 Vue 中 computed 和 watch 有什么区别?​

2.26 Vue 中为何不要把 v-if 和 v-for 同时用在同一个元素上， 原理是什么?​

三、生命周期​

3.1 Vue 生命周期是什么?​

3.2 Vue 生命周期有哪些?​

3.3 数据请求在 created 和 mounted 的区别?​

3.4 vue 父子组件生命周期调用顺序?​

3.5 Vue每个生命周期都做了什么？​

四、模版编译​

4.1 Vue.js 3.0 编译器原理?​

4.2 Vue.js 3.0 编译器优化策略?​

4.3 Vue.js 3.0 如何实现静态提升?​

4.4 Vue.js 3.0 如何实现靶向更新？​

4.5 Vue.js 3.0 如何实现缓存内联事件处理函数?​

4.6 Vue 是如何解析指令? 如何解析模版变量？ html 标签？​

4.7 Vue 是怎么解析 template 的？template 会变成什么？​

4.8 Vue 中有用过 render 吗? render 和 template 有什么关系?​

4.9 什么是 PatchFlag?​

4.10 什么是 HoistStatic 和 CacheHandler ?​

五、通信方式​

5.1 vue 父子组件如何通讯？​

5.2 如何用自定义事件进行 vue 组件通讯?​

六、状态管理​

6.1 Vuex 机制?​

6.2 Pinia 机制?​

6.3 Vue 单向数据流的优缺点​

七、异常处理​

7.1 Vue 中如何捕获异常? Vue 中如何处理异常?​

八、框架对比​

8.1 vue3 升级了哪些重要功能?​

8.2 Vue 与 React 有什么区别?​

8.3 Vue Template VS React JSX?​

8.4 Vue2.0 与 Vue3.0 有什么区别?​

8.5 Vue 组合函数与 React Hooks 的区别​

8.6 Vue 3.0 Hooks 与 React Hooks 区别?​

8.7 说说Vue 3.0 中 TreeShaking 特性？举例说明一下？​

8.8 vue3 和 vue2 的生命周期有什么区别？​

九、Diff 算法​

9.1 虚拟DOM 是什么?​

9.2 虚拟DOM 有什么优势?​

9.3 虚拟DOM 原理是什么？​

9.4 如何实现一个虚拟 DOM?​

9.5 虚拟DOM（VDom）真的很快吗？​

9.6 Vue3.0 Diff 算法机制?​

9.7 Vue2 Diff Vs Vue3 Diff Vs React Diff?​

9.8 v-for 为何使用 key? 如果遇到相同的 key 会怎么样？​

9.9 Vue、React 在虚拟 DOM 的 Diff 上，做了哪些改进使得速度很快？​

9.10 Vue 中 key 的作用是什么? Vue 中如果不加 key 会怎么样? Vue 中为什么不能用 Index 作为 key? Vue 中如果用 Index 作为 key 会怎么样?​

十、Vue Router​

10.1 Vue-Router 是如何实现的?​

10.2 Hash Router 与 History Router?​

10.3 Vue-router的 MemoryHistory 是什么？​

10.4 路由原理 history 和 hash 两种路由方式的特点?​

十一、Composition API​

11.1 Vue3 封装 useLocation​

11.2 Composition API 如何实现逻辑复用?​

11.3 Composition API 和 React Hooks 的对比 ?​

11.4 如何理解 Composition API 和 Options API ?​

十二、其他​

12.1 slot是什么？​

12.2 vue 如何缓存组件?​

12.3 vue 动态组件是什么？​

12.4 vue 如何异步加载组件？​

12.5 Vue3 使用 JSX 实现 Slot ?​

12.6 Vue3和 JSX Slot 的一些问题?​

12.7 Vue3 JSX 和 Template 的区别?​

12.9 Vue3 使用 JSX 实现作用域 Slot?​

12.8 vue 组件更新之后如何获取最新 DOM？​

12.10 Vue 中 Scoped Styles 是如何实现样式隔离的，原理是啥?​

参考资料​

金九银十，带你复盘大厂常问的项目难点