Vue的响应式原理及其实现方式

vue的响应式原理就是使用Object.definproperty()方法，把对象的属性转化为getter 和setter来追踪数据的变化

实现的步骤：

        1.初始化 在Vue实例初始化时，会遍历data对象的所有属性，并使用Object.defineProperty()将每个属性转换为getter和setter。这样，当访问或修改data对象中的属性时，Vue能够捕获到并做出相应的响应。

        2.getter 读取操作 在getter中，Vue会记录当前正在进行依赖收集的Watcher（观察者），将其添加到依赖列表中。当属性被读取时，Vue会将Watcher与该属性关联起来。

        3.setter 修改操作 在setter中，当属性被修改时，Vue会通知依赖列表中的所有Watcher进行更新。这样，当数据发生改变时，相关的组件和视图都会得到更新。

        4.依赖收集 vue通过Dep类来管理Watcher和属性之间的关系 Vue通过Dep类来管理Watcher和属性之间的关系。每个属性都对应一个Dep实例，其中包含一个存储Watcher的数组。当属性的getter被调用时，会将当前的Watcher添加到Dep的数组中，建立起依赖关系。

        5.Watcher 观察者，创建依赖关系，数据变化时执行对应操作 Watcher是观察者的概念，它负责创建Vue实例中模板中使用到的依赖关系，并在数据变化时执行对应的更新操作。Vue中有多种类型的Watcher，包括渲染Watcher、计算属性Watcher等。