最近在总结vue系列的时候是看到响应原理的时候,看到一个新的知识点也就是我们的标题Object.defineProperty()的时候，好了话不多说，我们来看看这个是怎么使用的
Object.defineProperty()方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性， 并返回这个对象。 --- MDN
上面这句话是MDN上写的，当你看到这句话的时候有什么感觉吗？没有？其实我看到这句话的时候确实也没什么感觉，那怎么办我们在看一边，哦发现了，cao，添加属性什么时候要怎么麻烦了写一个这么长的代码啊，我以前都是这样写的
var obj = new Object; //obj = {}
obj.name = "张三"; //添加描述
obj.say = function(){}; //添加行为var obj = {
name : "张三",
say : function(){}
}
我们来看下object.defineProperty的语法从而去了解他和我们以前的写法有什么不一样
一：针对属性，我们可以给这个属性设置一些特性，比如是否只读不可以写(不可以修改)；是否可以被for..in或Object.keys()遍历（不会被被枚举遍历），用object.defineProperty写出来的属性，默认值是不可修改，和不会被遍历出来的，（后面会讲）
二：其实object.definePorperty的存取器描述有点绑定事件的感觉（后面会写）
Object.defineProperty(obj, prop, descriptor)obj :目标对象
prop :需要定义或修改的属性
descriptor :需要定义或修改的属性描述符返回的是一个对象，就是我们修改后的obj对象给对象的属性添加特性描述，目前提供两种形式：数据描述和存取器描述。
数据描述符和存取描述符均共同具有以下可选键（属性）值：
configurable
当且仅当该属性的 configurable 为 true 时，该属性描述符(就是像configurable,enumerable之类的描述符)才能够被改变，同时该属性也能从对应的对象上被删除。默认为 false。
//-----------------测试目标属性是否能被删除------------------------
var obj = {}
//第一种情况：configurable设置为false，不能被删除。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:false
});
//删除属性
delete obj.newKey;
console.log( obj.newKey ); //hello
//第二种情况：configurable设置为true，可以被删除。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:true
});
//删除属性
delete obj.newKey;
console.log( obj.newKey ); //undefined
//-----------------测试是否可以再次修改特性------------------------
var obj = {}
//第一种情况：configurable设置为false，不能再次修改特性。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:false
});
//重新修改特性
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:true,
enumerable:true,
configurable:true
});
console.log( obj.newKey ); //报错：Uncaught TypeError: Cannot redefine property: newKey
//第二种情况：configurable设置为true，可以再次修改特性。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:true
});
//重新修改特性
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:true,
enumerable:true,
configurable:true
});
console.log( obj.newKey ); //helloenumerable
当且仅当该属性的enumerable为true时，该属性才能够出现在对象的枚举属性中。默认为 false。
这也说明了为什么用object.defineProperty()的时候默认是不可修改，和不会被枚举出来的了
那么我们说明了共同点我们就来分别来说明他们直接的写法
（configurable，configurable）
value
该属性对应的值。可以是任何有效的 JavaScript 值（数值，对象，函数等）。当value没有定义的时候，值为undefined, 和一般情况下一样的
writable
当且仅当该属性的writable为true时，value才能被赋值运算符改变，重新重写成功，默认为 false。
默认情况下在数据描述符写法下value的值是不可以随便改变的，
var obj = {}
//第一种情况：writable设置为false，不能重写。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false
});
//更改newKey的值
obj.newKey = "change value";
console.log( obj.newKey ); //hello
//第二种情况：writable设置为true，可以重写
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:true
});
//更改newKey的值
obj.newKey = "change value";
console.log( obj.newKey ); //change value（configurable，configurable）
get
一个给属性提供 getter（取） 的方法，如果没有 getter 则为 undefined。当访问该属性时，该方法会被执行，方法执行时没有参数传入，但是会传入this对象。
默认为 undefined。
set
一个给属性提供 setter （改，设置）的方法，如果没有 setter 则为 undefined。当属性值修改时，触发执行该方法。该方法将接受唯一参数，即该属性新的属性值（就是我们定义字符属性值修改的值）。
默认为 undefined。
注意：当使用了getter或setter方法，不允许使用writable和value这两个属性，二种不同的用法，一般情况下第二种用的多
var obj = {};
var initValue = 'hello';
Object.defineProperty(obj,"newKey",{
get:function (){
//当获取值的时候触发的函数
return initValue;
},
set:function (value){
//当设置值的时候触发的函数,设置的新值通过参数value拿到，这里value的值就是我们更改的值
initValue = value;
}
});
//获取值
console.log( obj.newKey ); //hello
//设置值
obj.newKey = 'change value';
console.log( obj.newKey ); //change value注意：get或set不是必须成对出现，任写其一就可以。如果不设置方法，则get和set的默认值为undefined
看一个set和get使用的例子
下面的例子展示了如何实现一个自存档对象。 当设置temperature 属性时，archive 数组会获取日志条目。
function Archiver() {
var temperature = null;
var archive = [];
Object.defineProperty(this, 'temperature', {
get: function() {
console.log('get!');
return temperature;
},
set: function(value) {
temperature = value;
archive.push({ val: temperature });
}
});
this.getArchive = function() { return archive; };
}
var arc = new Archiver();
arc.temperature; // 'get!'
arc.temperature = 11;
arc.temperature = 13;
arc.getArchive(); // [{ val: 11 }, { val: 13 }]如果你这个看懂了那就恭喜你了，应该是会了
如果访问者的属性是被继承的，它的 get 和set 方法会在子对象的属性被访问或者修改时被调用。如果这些方法用一个变量存值，该值会被所有对象共享。
function myclass() {
}
var value;
Object.defineProperty(myclass.prototype, "x", {
get() {
return value;
},
set(x) {
value = x;
}
});
var a = new myclass();
var b = new myclass();
a.x = 1;
console.log(b.x); // 1 
那么如何结局上面的问题：在继承的对象中添加的属性值会被继承
在解决问题的时候我们先分析问题：这里的访问者就是a和b他们的x属性就是继承过来的，那么a或b中的x的属性值发生改变的时候他们继承的get方法和set方法会触发，所以有引发了下一个问题（get或set函数中的this的指向），那么这里的this的指向就是他们的访问者，是访问值触发的get或set函数
那么解决问题的方法就是，当触发set的时候给自己对于的访问者添加属于自己的属性值。
function myclass() {
}
Object.defineProperty(myclass.prototype, "x", {
get() {
return this.stored_x;
},
set(x) {
this.stored_x = x;
}
});
var a = new myclass();
var b = new myclass();
a.x = 1;
console.log(b.x); // undefined注意：一般情况下在原型（prototype）中建立的属性值，与new出来的实例中的属性值是没有关系的，直接修改实例上的方法是不会影响原型是的方法的
------一般情况下------
function myclass() {}
myclass.prototype.b = 10;
var b = new myclass();
console.log(b.b); // 10
b.b =2;
console.log(b.b); // 2 这里发生了改变
console.log(b.prototype.b) //10
------object.defineProperty-------
function myclass() {
}
Object.defineProperty(myclass.prototype, "y", {
writable: false, // 不管这里是false 还是 true
value: 1
});
var a = new myclass();
a.y = 2; // Ignored, throws in strict mode
console.log(a.y); // 1 这里没有改变
console.log(myclass.prototype.y); // 1 好了这里就是这篇快结束了，那么和vue的响应式有什么关系呢？当你把一个普通的 JavaScript 对象传给 Vue 实例的 data 选项，Vue 将遍历此对象所有的属性，并使用 object.defineproperty 把这些属性全部转为 getter/setter.这些 getter/setter 对用户来说是不可见的，但是在内部它们让 Vue 追踪依赖，在属性被访问和修改时通知变化，其实就是model改变后通过object.defineproperty来改变view中的值，来达到单向数据流，而不是双向绑定（vue中不是双向绑定）