m0_54740440的博客

1、响应式系统升级 　Vue2响应式原理使用的是 defineProperty，在初始化的时候会遍历所有成员，通过 defineProperty，把对象属性转换成get/set,如果data中的属性又是对象的话需要递归处理每一个子对象的属性，这些都是在初始化的时候执行的，也就是说对于一些未使用到的属性也进行了响应式处理。 Vue3响应式原理使用的是proxy对象，proxy的性能本身就要比 defineProperty好，另外，代理对象可以拦截属性的访问、赋值、删除等操作，不需要初始化的时候遍 历所有的属性

Vue3 使用 Proxy 对象重写响应式系统，这个系统主要有以下几个函数来组合完成的： 1、reactive: 接收一个参数，判断这参数是否是对象。不是对象则直接返回这个参数，不做响应式处理 创建拦截器对象 handler, 设置 get/set/deleteProperty get 收集依赖（track） 返回当前 key 的值。 如果当前 key 的值是对象，则为当前 key 的对象创建拦截器 handler, 设置 get/set/deleteProperty 如果当前的 key 的值不是对象，则返

Composition Api 设计动机 Vue 2.x在开发中小型项目的时候已经很好用了，但是在开发一些长期迭代的大型项目的时候会有一些限制，项目中可能会有一些功能比较复杂的组件，我们在看他人开发的组件时，可能会很难看懂，原因是Vue 2.x采用的是Options Api，指的是一个描述组件选项的对象，来创建组件的方式，这种方式我们经常使用。我们在创建组件的时候经常使用到data、methods、props、computed、生命周期钩子函数等，这些选项组成一个对象来描述组件，那么同一个功能的代码可能涉及