从互联网整理而来

一、JS/TS 前置基础

  1. var、let、const 区别
  2. 原型、原型链原理
  3. 闭包概念、使用场景、内存泄漏风险
  4. 同步异步、宏任务微任务执行顺序
  5. Promise 三种状态、链式调用、静态方法
  6. async/await 底层原理
  7. 数组常用遍历方法差异
  8. 深浅拷贝实现与区别
  9. Object.defineProperty 与 Proxy 对比
  10. Reflect 对象作用
  11. 箭头函数与普通函数区别
  12. 解构赋值、展开运算符
  13. ES6 模块 import/export 与 CommonJS 区别
  14. TypeScript 泛型、接口、类型推导
  15. EventLoop 完整执行流程

二、Vue2 基础核心

  1. Vue 双向绑定底层原理
  2. Object.defineProperty 如何监听对象、数组变化
  3. Vue2 数组重写了哪些方法，为什么不能监听下标修改
  4. Dep、Watcher、Observer 三者关系
  5. 什么是响应式依赖收集、派发更新
  6. 数据劫持流程完整过程
  7. computed 和 watch 区别
  8. computed 缓存实现原理
  9. methods、computed、watch 使用场景区分
  10. Vue 生命周期全部钩子及执行时机
  11. created、mounted、updated、destroyed 使用场景
  12. 父子组件生命周期执行顺序
  13. v-if 和 v-show 底层区别与性能差异
  14. v-for 绑定 key 的作用，key 不能用 index 的原因
  15. v-if 和 v-for 同时使用的优先级与问题
  16. v-model 底层语法糖实现
  17. 修饰符 .lazy .number .trim 原理
  18. 指令自定义实现，钩子函数有哪些
  19. 过滤器 filter 使用场景，Vue3 废弃原因
  20. 插值表达式、v-text、v-html 区别
  21. Vue 模板编译流程
  22. render 函数与 template 关系
  23. VNode 虚拟 DOM 结构作用
  24. Diff 算法执行流程
  25. Vue2 Diff 同层比较、key 作用、头尾指针优化
  26. patch 函数更新逻辑
  27. nextTick 原理，微任务/宏任务降级策略
  28. $nextTick 使用场景

三、Vue2 组件通信

  1. 父子组件 props 传递规则，单向数据流
  2. props 类型校验、默认值、必填配置
  3. $emit 子传父实现
  4. .sync 修饰符作用，Vue3 移除原因
  5. $parent、$children、$refs 获取组件/元素
  6. provide / inject 使用场景与响应式缺陷
  7. EventBus 事件总线实现、内存泄漏问题
  8. Vuex 全局状态通信完整流程
  9. $attrs、$listeners 跨层级透传
  10. 跨页面、多层级组件通信方案对比

四、Vuex 状态管理

  1. Vuex 五大核心概念 state、getters、mutations、actions、modules
  2. mutations 必须同步、actions 异步原因
  3. commit 和 dispatch 区别
  4. getters 缓存特性
  5. modules 模块划分，命名空间 namespaced
  6. 辅助函数 mapState/mapGetters/mapMutations/mapActions 使用
  7. Vuex 持久化存储方案
  8. Vuex 严格模式 strict 作用
  9. 多个组件同时修改同一 state 数据流
  10. Vuex 底层响应式原理

五、Vue Router 2/3

  1. SPA 单页面路由实现原理
  2. hash 模式与 history 模式底层区别
  3. history 模式后端 nginx 配置问题
  4. 路由导航守卫分类：全局、路由独享、组件内
  5. 导航守卫执行完整顺序
  6. $route 和 $router 区别
  7. 路由传参 params 和 query 差异
  8. params 刷新丢失参数解决方案
  9. 动态路由匹配、路由嵌套
  10. 路由懒加载实现与分包
  11. addRoutes、addRoute 动态添加路由
  12. 路由元信息 meta 使用场景
  13. 路由缓存 keep-alive 原理
  14. include/exclude/max 参数作用
  15. activated、deactivated 生命周期钩子
  16. 路由跳转 push、replace、go 区别
  17. 登录鉴权全局路由拦截实现

六、Vue2 进阶知识点

  1. keep-alive 缓存组件底层逻辑
  2. 异步组件、组件懒加载
  3. 组件递归实现菜单、树形结构
  4. $once、$off、$on 事件方法
  5. 插槽分类：默认插槽、具名插槽、作用域插槽
  6. 作用域插槽数据传递原理
  7. v-once 指令作用
  8. Vue 模板编译生成 AST 抽象语法树
  9. 异步更新队列机制
  10. 页面大量数据渲染卡顿优化方案
  11. Object.freeze 冻结数据对响应式的影响
  12. $set 原理，什么场景必须使用
  13. Vue2 响应式存在的缺陷
  14. 全局过滤器、全局指令、全局组件注册
  15. mixin 混入原理、合并规则、冲突问题

七、Vue3 核心升级（Composition API）

  1. Vue3 相比 Vue2 性能提升点
  2. Vue3 响应式改用 Proxy 优势
  3. Proxy 对比 Object.defineProperty 解决了哪些痛点
  4. Reflect 配合 Proxy 的作用
  5. reactive、ref 区别与底层实现
  6. ref 为什么基础类型需要包裹对象
  7. toRef、toRefs 使用场景，解决的问题
  8. computed 在 setup 中使用方式
  9. watch、watchEffect 区别
  10. watch 监听对象、数组深度监听配置
  11. setup 执行时机，this 指向问题
  12. setup 参数 props、context 内容
  13. Composition API 对比 Options API 优势
  14. script setup 语法糖带来的变化
  15. script setup 中 defineProps、defineEmits、defineExpose
  16. 生命周期钩子组合式写法 onMounted/onUpdated 等
  17. getCurrentInstance 获取组件实例
  18. provide / inject 在 Vue3 中如何实现响应式
  19. 自定义 hooks 封装思路，复用逻辑
  20. Vue3 生命周期完整列表，与 Vue2 对应关系

八、Vue3 模板、编译、Diff 优化

  1. Vue3 模板编译优化：PatchFlags 标记
  2. 静态提升原理，减少 VNode 创建开销
  3. 缓存内联事件处理函数
  4. Vue3 Diff 算法优化：最长递增子序列
  5. Diff 对比流程相比 Vue2 改进点
  6. Fragment 根节点多标签支持原理
  7. Teleport 传送门组件底层实现
  8. Suspense 异步组件加载处理
  9. v-model 在 Vue3 语法变更，多 v-model 实现
  10. .v-model 修饰符自定义处理
  11. 插槽 v-slot 简写语法变化
  12. Vue3 移除 filter 过滤器替代方案

九、Pinia（Vue3 状态管理）

  1. Pinia 相比 Vuex 的优势
  2. Pinia 核心概念 state、getters、actions
  3. Pinia 支持同步异步，不再区分 mutations
  4. defineStore 定义仓库，id 作用
  5. 直接修改 state 与 $patch 批量更新区别
  6. $reset、$subscribe、$onAction 使用场景
  7. Pinia 模块化拆分，无需命名空间
  8. Pinia 持久化插件使用
  9. setup 语法下使用 Pinia
  10. 多个仓库互相调用数据方法

十、Vue Router 4（Vue3）

  1. createRouter、createWebHashHistory、createWebHistory
  2. RouterView、RouterLink v-slot 插槽用法
  3. useRoute、useRouter 组合式 API 获取路由实例
  4. 动态路由 addRoute 替换 addRoutes
  5. 路由守卫组合式写法
  6. 路由缓存与 Suspense 配合
  7. 路由元类型 TS 类型提示处理

十一、Vue3 高级特性

  1. watchPostEffect、watchSyncEffect 区别
  2. shallowRef、shallowReactive 浅层响应式作用
  3. readonly、shallowReadonly 只读代理
  4. customRef 自定义响应式引用
  5. effectScope 作用域收集副作用
  6. defineCustomElement 构建原生 webComponent
  7. Vue3 全局 API 变更 createApp 替代 new Vue()
  8. app.config 全局配置项
  9. 全局组件、指令、插件注册方式变化
  10. Transition、TransitionGroup 动画组件原理
  11. v-memo 缓存 VNode 优化渲染
  12. 异步 setup 函数配合 Suspense

十二、工程化 & 构建工具

  1. Vue CLI 与 Vite 底层构建区别
  2. Vite 冷启动快的原理，esbuild 预构建
  3. Vite 热更新 HMR 实现机制
  4. vite.config.js 常用配置
  5. webpack 打包 Vue 文件流程 vue-loader
  6. .vue SFC 单文件组件解析过程
  7. scoped 样式隔离原理，深度选择器 /deep/ ::v-deep :deep()
  8. CSS Module 使用方式
  9. 环境变量 .env 文件区分开发测试生产
  10. 跨域代理 proxy 配置
  11. 打包体积优化方案
  12. 分包、懒加载、gzip 压缩配置
  13. TS 在 Vue 项目中配置声明文件
  14. 第三方 UI 库按需引入配置
  15. 全局自动导入组件、API 插件 unplugin-auto-import

十三、网络请求与封装

  1. axios 拦截器请求、响应封装思路
  2. 请求 loading、统一错误处理封装
  3. token 过期自动刷新逻辑
  4. 请求取消、重复请求拦截方案
  5. 并发请求处理
  6. 接口数据统一格式化处理
  7. 封装请求 hooks 适配 Vue3

十四、性能优化专项

  1. 减少不必要组件渲染手段
  2. v-once、v-memo 使用场景
  3. 长列表虚拟滚动实现原理
  4. 响应式数据避免不必要监听
  5. computed 缓存减少重复计算
  6. 图片懒加载方案
  7. 路由懒加载分包优化
  8. keep-alive 合理缓存减少重复请求
  9. 避免频繁触发 watch
  10. 大列表数据冻结 Object.freeze
  11. 减少 DOM 操作，合理使用虚拟 DOM
  12. 打包体积优化：Tree-Shaking、剔除无用依赖
  13. Vite/Webpack 构建速度优化
  14. 内存泄漏常见场景：定时器、事件监听、未销毁订阅
  15. Chrome Performance 面板排查页面卡顿

十五、混合、插件、拓展开发

  1. Vue2 mixin 缺陷，Vue3 用 hooks 替代原因
  2. Vue 插件开发完整结构 install 方法
  3. 全局自定义指令完整开发
  4. 封装业务通用组件规范
  5. 二次封装 Element Plus / Ant Design Vue
  6. 封装全局弹窗、消息提示组件
  7. 自定义全局权限指令 v-permission
  8. 页面权限、按钮权限实现方案
  9. 全局错误捕获 errorHandler
  10. 埋点、全局请求监控插件封装

十六、项目实战场景问答题

  1. 项目整体架构分层设计
  2. Vue2 升级 Vue3 迁移改造遇到的问题
  3. 大型项目状态管理选型 Vuex / Pinia 理由
  4. 复杂树形菜单、表格组件封装思路
  5. 表单校验全局统一封装方案
  6. 页面权限控制完整实现流程
  7. 多环境配置、多渠道打包处理
  8. 首屏加载速度优化做了哪些处理
  9. 路由鉴权、未登录拦截逻辑
  10. 列表大量数据渲染卡顿如何解决
  11. 项目打包体积过大优化方案
  12. 页面缓存、返回保留表单状态实现
  13. 接口并发冲突、重复提交拦截
  14. 移动端适配方案 vw/vh、rem
  15. 线上报错监控、异常捕获方案