【JavaScript】 Object.defineProperty

参照 http://www.tuicool.com/articles/ju26riE
以及 http://www.07net01.com/2015/08/908747.html。

Object.defineProperty：直接在一个对象上定义一个新的属性，或修改一个已经存在的属性。这个方法会返回该对象。

语法：

Object.defineProperty(obj, prop, descriptor)

• Object obj 目标对象
• String prop 需要定义的属性

• Object descriptor 该属性拥有的特性，可设置的值有：

  value 属性的值，默认为 undefined。

  writable 该属性是否可写，如果设置成 false，则任何对该属性改写的操作都无效（但不会报错），默认为 false。

  get 一旦目标对象访问该属性，就会调用这个方法，并返回结果。默认为 undefined。

  set 一旦目标对象设置该属性，就会调用这个方法。默认为 undeinfed。

  configurable 如果为 false，则任何尝试删除目标属性或修改属性以下特性（writable, configurable, enumerable）的行为将被无效化，默认为 false。

  enumerable 是否能在for…in循环中遍历出来或在Object.keys中列举出来。默认为 false。

注意

在 descriptor 中不能 同时 设置访问器 (get 和 set) 和 wriable 或 value，否则会报以下错误：

Invalid property.  A property cannot both have accessors and be writable or have a value

实例：

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。所以第二次再设置就会报错。
*/

writable

如果设置为fasle，就变成只读了。

var a = {}; 

Object.defineProperty(o, "b", { 
    value : 123,
    writable : false });

console.log(a.b); // 打印 37
a.b = 25; // 没有错误抛出（在严格模式下会抛出，即使之前已经有相同的值）
console.log(o.a); // 打印 37， 赋值不起作用。

enumerable

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

var a= {}
Object.defineProperty(a,"b",{
  value:3445,
  enumerable:true
})
console.log(Object.keys(a));// 打印["b"]

将 enumerable 改为 false。

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

set 和 get

var a= {}
Object.defineProperty(a,"b",{
  set:function(newValue){
    console.log("你要赋值给我,我的新值是"＋newValue)
    },
  get:function(){
    console.log("你取我的值")
    return 2 //注意这里，我硬编码返回2
   }
})
a.b =1 //打印 你要赋值给我,我的新值是1
console.log(a.b)    //打印 你取我的值
                    //打印 2    注意这里，和我的硬编码相同的

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