JS中對象幾點須要注意的地方

  • 如何判斷對象中是否包含一個屬性
var Person = {
        name : 'wenzhe',
        number : 91
    };
    
    // checks for both own properties and prototype properties
    console.log('number' in Person);  // true
    console.log('constructor' in Person);  // true
    
    //  only checks for own properties
    console.log(Person.hasOwnProperty('number'));  // true
    console.log(Person.hasOwnProperty('constructor'));  // false
  • 刪除對象中一個屬性
var Person = {
        name : 'wenzhe',
        number : 91
    };
    
    delete Person.name;
    console.log('name' in Person) // false
  • 列舉對象中的屬性和值
var Person = {
        name : 'wenzhe',
        number : '00'
    };
    
    for (pro in Person) {
        console.log(pro + ' : ' + Person[pro]);
    }
    
    // name : wenzhe
    // number : 00
    // 此方法能夠枚舉本身和原型鏈中的內容
    
    
    
    // 還能夠使用對象的keys方法,它返回一個數組,裏面的內容就是由全部
    // 的對象的key值構成的數組, 可是不會包含原型鏈中的內容
    
    var properties = Object.keys(Person);
    var i = 0, len = properties.length;
    for (var i = 0, len = properties.length; i < len; i++) {
        console.log(properties[i] + ' : ' + Person[properties[i]]);
    }
  • 枚舉
    若是某個屬性的的設定爲不可枚舉的,那麼上面那兩種方法都不能顯示出那個屬性,可是對於keys返回的那個數組,仍然包含不可被枚舉的那個值數組

    //  properties是數組,每一個數組都有本身的length屬性
        console.log('length' in properties) // true;
        console.log(Person.propertyIsEnumerable('length'));  // false
  • Get & Set(accessor properties)this

    var Person2 = {
        name : 'wenze';
        
        get name() {
            console.log('Reading name');
            return this.name;
        }
        
        set name(value) {
            console.log('Setting name');
            this.name = value;
        }
    }
    
    Person2.name = "Chen";
  • 在對象外面爲對象添加屬性的方法prototype

    • 在對象外面添加通常的屬性(Data Property)--Object.definePropertycode

      var person = {};
      Object.defineProperty(person, "name", {
          value : 'wz', // 該屬性的值
          enumerable : true, // 是否能夠被枚舉
          configurable : true,  //name能夠由Data pro <-> accessor property
          writable : false //  不能在被更改,同類型也不行
          })
    • 在對象外面添加 get&set對象

      var person1 = {name : 1};
      Object.defineProperty(person1, "name", {
          get: function() {
              console.log("Reading name");
              return this._name;
          },
          set: function(value) {
              console.log("Setting name to %s", value);
              this._name = value;
          },
          enumerable: true,
          configurable: true
      })
    • 添加多個屬性使用Object.definePropertyip

      var person1 = {};
      Object.defineProperties(person1, {
         _name: {
             value: "Nicholas",
             enumerable: true,
             configurable: true,
             writable: true
          },
          name: {
                 get: function() {
                     console.log("Reading name");
                     return this._name;
                 },
                 set: function(value) {
                     console.log("Setting name to %s", value);
                     this._name = value;
                 },
                 enumerable: true,
                 configurable: true
         }
      });
  • 查看屬性值的設置狀況原型鏈

    var person1 = {
        name: "WZ"
    };
    var descriptor = Object.getOwnPropertyDescriptor(person1,       "name");
     
    console.log(descriptor.enumerable);
    console.log(descriptor.configurable);
    console.log(descriptor.writable);
    console.log(descriptor.value);
    // true
    // true
      // true
      // "WZ"
相關文章
相關標籤/搜索