Object.defineProperty()函數可向對象添加新的屬性或者修改對象的現有屬性


語法:Object.defineProperty(object,propertyName,descriptor)

參數:1.object 必需。要在上面添加和修改屬性的對象。這可以是一個js對象(即用戶定義的對象或者內置對象)或DOM對象。

   2.propertyName 必需。屬性名稱,是一個字符串。

   3.descriptor 必需。描述屬性,可以針對數據屬性或者訪問器屬性。

備注:如果想對象添加多個屬性或者修改多個現有屬性,可使用Object.defineProperties()函數。

返回值:修改后的對象。

添加數據屬性:

  eg: var  newHerizon = "<hr/>";

    var newObj={};

    Object.defineProperty(newObj,"newDataProperty",{

      value:1,

      writable: true,

      enumerable:true,

      configurable:true

    })

    newObj.newDataProperty = 2;

    document.write("Property value:" + newObj.newDataProperty + newHerizon);

    // output:

    // Property value:2

    PS:若要獲取對象的屬性,則

    var names = Object.getOwnPropertyNames(newObj);

    for(var i = 0; i < names.length; i++){

      var prop = names[i];

      document.write(prop + ':' + newObj[prop]);

      document.write(newHerizon);

    }

    // output:

    // newdataProperty:2

修改數據屬性:

  如要修改對象的屬性特性,需要將下面代碼添加到所示的addProperty函數。descriptor參數只包含writable特性。其他數據屬性特性保持不變。

  Object.defineProperty(newObj,"newDataProperty,{ writable : false });

  var descriptor = Object.getOwnPropertyDescriptor(newObj,"newDataProperty");

  for(var prop in descriptor){

    document.write(prop + ":" + descriptor[prop]);

    document.write(newHerizon);

  }

  // output

  // writable :false

  // value:2

  //configurable:true

  //enumerable:true

添加訪問器屬性:

  eg: var newHerizon = "<hr />";

    var newObj = {};

    Object.defineProperty(newObj,"newAccessProperty",{

      set: function(x){

        document.write("in property set accessor" + newHerizon);

        this.newaccpropvalue = x;

      },

      get: function(){

        document.write("in property get accessor" + newHerizon);

        return this.newaccpropvalue;

      },      

      enumerable:true,

 

      configurable:true

 

    });

    newObj.newAccessorProperty = 10;

    document.write("Property value " + newObj.newAccessorProperty + newHerizon);

    // output:

    // in property set accessor

    // in property get accessor

    // Property value:10

    如要獲取對象屬性,需要添加如下代碼。

   

    var names = Object.getOwnPropertyNames(newObj);

 

    for(var i = 0; i < names.length; i++){

 

      var prop = names[i];

 

      document.write(prop + ':' + newObj[prop]);

 

      document.write(newHerizon);

 

    }

 

    // output:

    // in property get accessor

 

    // newdataProperty:10

修改訪問器屬性:

    Object.defineProperty(newObj,"newAccessorProperty",{

       get: function(){ return this.newaccpropvalue;}

    });

    var descriptor = Object.getOwnPropertyDescriptor(newObj,"newAccessorProperty");

    for(var prop in descriptor){

         document.write(prop + ":" + descriptor[prop]);

      document.write(newHerizon);

    }

         // output:

    // get:function(){ return this.newaccpropvalue}

    // set: function(x){ document.write("in property set accessor" + newHerizon); this.newaccpropvalue = x;}

    //configurable:true

    //enumerable:true

修改DOM元素上的屬性:

   通過使用 Object.getOwnPropertyDescriptor 函數來獲取和修改屬性的屬性描述符,從而自定義內置 DOM 屬性。  對於此示例中,必須通過使用 ID 為“div”的 DIV 元素。  

  var descriptor = Object.getOwnPropertyDescriptor(Element.prototype, "querySelector");
  descriptor.value = "query";
  descriptor.writable = false;
  // Apply the changes to the Element prototype.
  Object.defineProperty(Element.prototype, "querySelector", descriptor);   
  var elem = document.getElementById("div"); 
  // Attempt to change the value. This causes the revised value attribute to be called.
  elem.querySelector = "anotherQuery";   document.write(elem.querySelector);   
  // output:   
  // query

要求:

  Internet Explorer 9 標准模式、Internet Explorer 10 標准模式以及 Windows 8.x 應用商店 應用支持所有功能。

  Internet Explorer 8 標准模式 支持 DOM 對象,但不支持用戶定義的對象。  可以指定 enumerable 和 configurable 特性,但不使用它們。  

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM