VUE2.0 数据劫持

Vue2.0双向数据绑定的方法，采用的是数据劫持+订阅发布者模式。用object.defineProperty()去绑定data中的值，然后在值变化的时候去触发和更新函数，去更新视图。（vue3.0是通过proxy去重新创建一个对象，在不污染原对象同时进行数据绑定，以后再进行详细介绍，暂时先简单了解一下）

下面描述都是2.0的有关知识：

Object.defineProperty(obj,key,descriptor)

obj:指的是目标对象。

key:需要定义的属性或方法名称。

descriptor:目标属性所拥有的特性。

descriptor有以下的属性

1.value：属性的值。

2.writable：如果为false，属性的值就不能被重写。

3.get：一旦目标属性被访问就会调用此方法，并将该方法的运算结果返回给用户。

4.set：一旦目标属性被赋值，就会调用这个方法。

5.configurable：可否被修改，如果为false。writable、configurable、enumerable 就不能被修改。

6.enumerable：可否被枚举，就是在循环或者keys的时候不可以被遍历到。

 

上面是对data的值进行监听，在set函数里面，当数据变化的时候，对其有操作就可以被监听到，然后可以对数据的视图做出改变。但是同时也存在一个问题，就是当数据初始化的时候，系统对每一个数据进行监听，如果后期在对象上加一个属性，就不会被监听到，所以需要使用Vue.set();

订阅器Dep

为了完成数据的可观测，我们需要创建一个依赖收集容器，用来容纳所有的订阅者，我们可以在数据被使用的时候通知那些依赖该数据的视图更新，一旦数据发生变化，就统一更新。创建消息订阅器Dep

订阅者watcher

订阅者watcher在初始化的时候，需要将自己添加进订阅器Dep中。