Vue3

1.vue3新变化

组合式api，以前vue2的方法、数据、监听都是通过选项的方式分块编写代码，组合式api是一系列 API 的集合，响应式、生命周期等api。为什么这么做：更方便逻辑复用，以前主要是使用混入实现函数复用，现在我们可以用组合式api更方便复用。代码组织更灵活，以前我们使用选项式api不得不将一个功能逻辑拆分到不同的选项中。现在组合式api我们可以将同一个组的逻辑逻辑代码直接写在一块。 setup语法糖（<script setup> 中的代码会在每次组件实例被创建的时候执行。）。以前是

2. vue响应式原理

vue2主要是使用发布订阅模式结合数据劫持实现响应式。 vue2通过Object.defineProperty递归遍历data中的所有属性，为每个属性定义getter和setter。实现数据劫持，当访问属性时触发 getter 收集依赖；当修改属性时触发 setter 通知更新。每个响应式属性对应一个 Dep 实例，内部维护一个数组 subs 存储所有依赖该属性的 Watcher。Watcher（观察者）：代表一个依赖（如组件渲染函数、计算属性、watch 监听器）。当数据变化时，Watcher 会收到通知并执行更新逻辑。

对比维度	Vue 2（Object.defineProperty）	Vue 3（Proxy）
核心 API	Object.defineProperty 逐个属性劫持	Proxy 代理整个对象
数组响应式	重写数组方法（push、pop 等），但无法监听索引修改和 length 变化	直接代理数组，完美支持索引修改和 length 变化
对象新增/删除属性	无法自动检测，需用 Vue.set / Vue.delete	完美支持，Proxy 能拦截所有属性操作
性能开销	初始化时递归遍历所有属性，深度越深性能越差	懒代理（访问时才进行深层代理），初始化性能更好
拦截能力	仅能拦截 get 和 set	可拦截 13 种操作（deleteProperty、has、ownKeys 等）
依赖粒度	属性级别的 Dep	更精细的「对象 + 属性」级别
内存与性能	每个属性都需要创建 Dep 实例	使用 WeakMap 存储依赖，无内存泄漏风险，整体性能更优（Vue 3.5 对响应式进行了重构，引入双向链表替代原有的 Set 存储依赖关系，依赖收集和依赖清理的性能提升了约 56%。双向链表允许更高效的依赖遍历和清理，特别是在大量副作用和频繁依赖变化的场景下表现尤为突出）

1. ts 的联合类型和交叉类型的区别有哪些

2. 你用过哪些ts工具类型，能说一下pick omit这种原理吗

3. less和sass如何写循环