Object.defineProperty

var a= {};
Object.defineProperty(a,"b",{
 value:123 
}) 
console.log(a.b);//123

1. 它接受三个参数，而且都是必填的。。 传入参数

第一个参数:目标对象
第二个参数:需要定义的属性或方法的名字。
第三个参数:目标属性所拥有的特性。（descriptor）

2. descriptor取值介绍

value: 属性的值(不用多说了)
writable: 如果为false，属性的值就不能被重写,只能为只读了
configurable: 总开关，一旦为false，就不能再设置他的（value，writable，configurable）
enumerable: 是否能在for...in循环中遍历出来或在Object.keys中列举出来。
get: 一会细说
set: 一会细说
descriptor默认值

我们再看看第一个例子

var a= {}
Object.defineProperty(a,"b",{
  value:123
})
console.log(a.b);//123

我们只设置了 value，别的并没有设置，但是 第一次的时候可以简单的理解为（暂时这样理解）它会默认帮我们把writable，configurable，enumerable。都设上值，而且值还都是false。。也就是说，上面代码和下面是等价的的（ 仅限于第一次设置的时候）

var a= {};
Object.defineProperty(a,"b",{
  value:123,
  writable:false,
  enumerable:false,
  configurable:false
})
console.log(a.b);//123

configurable

---

总开关，第一次设置 false 之后，，第二次什么设置也不行了，比如说

var a= {}
Object.defineProperty(a,"b",{
  configurable:false
})
Object.defineProperty(a,"b",{
  configurable:true
})
//error: Uncaught TypeError: Cannot redefine property: b

就会报错了。。注意上面讲的默认值。。。如果第一次不设置它会怎样。。会帮你设置为false。。所以。。第二次。再设置他会怎样？。。对喽，，会报错

enumerable

---

属性特性 enumerable 定义了对象的属性是否可以在 for...in 循环和 Object.keys() 中被枚举。

var a= {}
Object.defineProperty(a,"b",{
  value:3445,
  enumerable:true
})
console.log(Object.keys(a));// 打印["b"]
改为false
var a= {}
Object.defineProperty(a,"b",{
  value:3445,
  enumerable:false //注意咯这里改了
})
console.log(Object.keys(a));// 打印[]
for...in 类似，，不赘述了
set 和 get

简单来说，， 这个 “b” 赋值 或者 取值的时候会分别触发 set 和 get 对应的函数

这就是实现 observe的关键啊。。下一篇，，我会分析vue的observe的实现源码，聊聊自己如何一步一步实现$watch

var a = {
  b: {
    c:1
  },
  d:1
}
a.$watch("b.c",()=>console.log("哈哈哈"))

例如：


  
  
  
  

  
   

   应用
    
    

转载至:月下菩提， 最后一次修改 2017-08-21