Vue--数据代理

Object.defineProperty

const person = {}; // 创建一个新对象
person.name=‘xusx’
// 通过 defineProperty 使用数据描述符添加对象属性的示例
Object.defineProperty(person, “age”, {
value: 37, // 默认值
writable: true, // 不可写 默认false
enumerable: true, // 是否可以枚举 默认false
configurable: true // 控制属性可否被删除
});
数据代理：get\set方法
person实际的属性值为xusx对象的属性值

		var xusx={}
		xusx.age=30
		var person={}
		person.name="xysx"
		Object.defineProperty(person,'age',{
			get(){
				return xusx.age
			},
			set(){
				 xusx.age
			}
		})

Vue中的数据代理

Vue对象data在其属性中为_data

总结

1、通过Vue对象来代理data对象中属性的操作(读\写)
2、通过Object.defineProperty ()把data对象中所有的属性添加到Vue上，为每一个添加到Vue上的属性，都制定一个getter/setter。去操作(读、写)data中对应的属性。

数据监视

• 1、vue会监视data中所有层次的数据
• 2、 通过setter实现监视，在new Vue就要传入要检测的数据
• 3、如果需给后添加的数据所响应式处理，则使用如下api:
  Vue.set(target,propertyName,value)
  注：Vue.set无法给根数据添加属性，即data下添加熟悉