Object.defineProperty小记

作用

可以设置对象属性。比如给对象设置新属性或修改原有属性。

用法

示例

Object.defineProperty(obj,key,{    
      value: val,    
      enumerable:true,    
      writable: true,    
      configurable: false,
      get:function(){},
       set:function(){},
  });

参数解释

 obj:要修改属性的对象,
 key:要定义或修改属性值,
 writable:给该属性赋值是否可以生效,
 enumerable:是否可以通过 for in遍历该属性,
 configurable:是否可配置, 以及除 writable 特性外的其他特性是否可以被修改。为    
 true属性时才能被删除,才能更改enumerable属性,否则会报错。赋值是一直都可以的。
 

下面定义一个空对象,然后用Object.defineProperty方法给这个空对象定义一个新的属性,设置它的writable参数为true。

var obj={ };
Object.defineProperty(obj,'test',{
   value: 'test1',
   writable: true,
});
console.log(obj);//obj{test:test1}

然后改变test属性的值。因为writeble的值为true,所以test属性的值是可以改变的。

obj.test="test2";//obj{test:test2}

如果writable的值为false,则test属性的值不会被改变。

Object.defineProperty(obj,'test',{
     writable: false,
});
obj.test="test3";//obj{test:test2}

enumerable决定这个对象是否可以通过for in遍历到该属性。true为可以通过for in遍历该属性。必须是configurable设置为true时enumerable的设置才能生效。

Object.defineProperty(obj,'test',{
    enumerable: !!false,
    configurable: true
});
for(var pro in obj){
    console.log(pro +':'+obj[pro]);
}//没有值打印出来

configurable的值为true时才能删除属性。

delete obj.test;//成功删除属性

每个对象属性都有默认的get和set方法,我们可以改写它。

var myValue;
Object.defineProperty(obj,'haha',{
    set:function () {//get和set要一起设
        myValue='test test';
    },
    get:function(){
        return myValue;
    },
    enumerable: true,
});
for(var pro in obj){
    console.log(pro +':'+obj[pro]);
}//haha:undefined
console.log(obj.haha);//undefined
obj.haha='777';
console.log(obj.haha);//test test

只有给haha赋值时,obj.haha这个属性才会被赋予set的值,不然会是 undefined。但是haha这个属性在赋值前就已经被定义了。

使用场景

在构造函数里自定义set和get方法。

function Test() {
    var pro = null;
    Object.defineProperty(this, "pro", {
        get: function () {
            return pro;
        },
        set: function (value) {
            pro = value
        }
    });
}
var mytest = new Test();//相当于把方法执行了一次
mytest.pro = haha;
console.log(mytest.pro);//haha

使用构造函数主要是限定自定义的set和get方法适用范围,例如上面的代码,就把这两个方法限定在mytest下。

我对上面一段的代码理解如下:

var Test1=function () {
     function gg() {
         this.tt=1;
     }
     gg.call(this);
 };
 var test = new Test1();
 console.log(test.tt);

参考链接:
Object.defineProperty()

    原文作者:milk
    原文地址: https://segmentfault.com/a/1190000009139579
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞