ECMAScript5之Object学习笔记（一）

随着IE的逐步追赶，目前到IE11已经能够很好的支持ECMAScript5标准了，其他的现代浏览器像firefox，chrome，opera就更不用说了。

再加上nodejs使得javascript在后台开发中得到施展的舞台，这很自然的激发了我对ECMAScript5相关的特性的求知欲望。

以此展开，写一个ECMAScript5新特性的学习笔记。

先来看看Object

• Object.create(proto[, propertiesObject])

  create方法通过指定的原型对象(prototype object)和属性(properties)来创建一个新的对象。

  proto：即为新创建对象的prototype

  propertiesObject：带属性描述的属性对象(姑且这么翻译)

  create方法能够让我们方便的通过prototype原型链来实现“继承”：

      // super class
      var Human = function(cfg) {
          this.gender = cfg.gender;
          this.name = cfg.name;
      };
  
      Human.prototype.sayHello = function() {
          console.log('Hello, I am ' + this.name);
      };
  
      // sub class
      var Citizen = function(cfg) {
          this.country = cfg.country; 
          // call super constructor
          Human.call(this, cfg);
      };
  
      // prototype chain inherit 
      Citizen.prototype = Object.create(Human.prototype);
      // override constructor
      Citizen.prototype.constructor = Citizen;
  
      // overwrite super class method
      Citizen.prototype.sayHello = function() {
          console.log('Hello, I am ' + this.name + ' from ' + this.country);
      };
  
      var h = new Human({
          gender: 'female',
          name: 'lucy'
      });
      h.sayHello();
      console.log( h instanceof Human );
  
      var c = new Citizen({
          gender: 'male',
          name: 'Andrew',
          country: 'USA'
      });
      c.sayHello();
      console.log( c instanceof Citizen);

• Object.defineProperty(obj, prop, descriptor)

  defineProperty方法直接在一个对象上定义一个新属性，或者更改一个已存在的属性，返回对象本身。

  obj：对象

  prop: 属性名

  descriptor: 属性描述对象

  用code来做直观说明：

  /*
      enumerable    是否可列举    默认：false
      writable    是否可写    默认：false
      configurable是否可配置    默认：false
      value    默认：undefined
      
      访问器
      get 默认：undefined  
      set    默认：undefined
      */
      var o = {};
  
      // enumerable 是否可列举
      Object.defineProperty(o, 'a', {
          value: 1,
          enumerable: false
      });
  
      Object.defineProperty(o, 'b', {
          value: 2,
          enumerable: true
      });
  
      Object.defineProperty(o, 'c', {
          value: 3
          // enumerable默认false
      }); 
  
      o.d = 4;
  
      for(var prop in o) {
          // 输出b、d
          console.log(prop);  
      }
  
      // writable 是否可写（更改值）
      // 这个特性在定义常量时比较有用
      Object.defineProperty(o, 'e', {
          value: 10,
          writable: false
      });
  
      console.log(o.e); // 10
      o.e = 15;    // 一般没错误抛出，若是在strict mode（严格模式下）会抛出错误        
      console.log(o.e); // 10
  
      // configurable 是否可配置
      Object.defineProperty(o, 'f', {
          configurable: true,
          get: function() { return 10; }
      });
  
      // 如果configurable为false，那么下面这些redefine（重定义）操作都会报TypeError
      // 如果configurable为true，那么下面这些操作均能成功，delete操作也能删除e属性
      Object.defineProperty(o, 'f', { configurable: true });    // TypeError
      Object.defineProperty(o, 'f', { enumerable: true });    // TypeError
      Object.defineProperty(o, 'f', { set: function() {} });    // TypeError
      Object.defineProperty(o, 'f', { get: function() {return 10;}});    //TypeError
      Object.defineProperty(o, 'f', { value: 12});     // TypeError
  
      console.log(o.f); // 10
      delete o.f;    // nothing happens     
      console.log(o.f); // 10
  
  
      // get, set访问器
      // 注意：有get、set的情况下，不能同存在value，writable属性，否则会报错
      var variable = 10;
      Object.defineProperty(o, 'g', {
          get: function() {
              return variable;
          },
          set: function(val) {
              variable = val;
          }
      });
  
      console.log(o.g);  // 10
      o.g = 14;    // set(14)
      console.log(o.g);    // 14
  
  
      // 补充：
      o.h = 1;
      // 相当于：
      Object.defineProperty(o, 'h', {
          value: 1,
          writable: true,
          configurable: true,
          enumerable: true
      }) ;
  
      Object.defineProperty(o, 'h', { value: 1 });
      // 相当于：
      Object.defineProperty(o, 'h', {
          value: 1,
          writable: false,
          configurable: false,
          enumerable: false
      });

• object.defineProperties(obj, props)

  这个与defineProperty的区别在于一下子可以定义多个属性，就再不展开了。

第一部分暂时到这里结束 : )，感兴趣的同学可以直接去MDN进行了解，请点击这里。