ES6 对象扩展

ES6 总结（五）

1、对象属性的简洁写法

• 属性简写

    var foo = "bar";
    var baz = { foo };
    baz; // { foo: "baz" }
    // 等价于
    var baz = { foo: foo };
    
    function f(x, y) {
      return { x, y };
    // 等价于： return { x: x, y: y };
    }
    f(1, 2); // {x: 1, y: 2}

• 方法简写

    var obj = {
      method() {
        return "yuan is an animal";
      }
    }
    // 等价于
    var obj = {
      method: function() {
        return "yuan is an animal";
      }
    }

2、属性名表达式

在ES5中，定义对象的属性有两种方法

• 方法一：标识符作为属性名
  obj.foo = true;
• 方法二：表达式作为属性名
  obj[“foo”] = true;

如果使用字面量方式定义对象，在ES5中只能使用方法一，而在ES6中可以使用方法二：

    let yuan = "monkey";
    let animal = {
      "type": "animal",
      [yuan]: "yuan is not monkey"
      "monkey":"yuan is not monkey"
    }
    
    
    animal["type"]; // "animal"
    animal[yuan]; // "yuan is not monkey"
    animal["monkey"]; // "yuan is not monkey"
    属性名定义方法：
    
    let monkey = {
      ['yuan']() {
        return "yuan is a monkey";
      }
    }
    monkey.yuan(); // yuan is a monkey"

• 方法的name 属性
  对象中的方法，也具有类似 function 的 name 属性：

    let monkey = {
      ['yuan']() {
        return "yuan is a monkey";
      }
    }
    monkey.yuan.name; //  "yuan"

3、Object.is()

     因在ES5中，并不能处理比较两个值是否严格相等，对于NaN，+0，-0等并不能做出严格相等来判断。
     Object.is() 这个方法就是来弥补上述的缺陷的：

    +0 === -0; // true
    NaN === NaN; // false
    
    Object.is(+0, -0); // false
    Object.is(NaN, NaN); // true

4、Object.assign()

基本用法：
             定义：将源对象（sourceN，不知一个源对象）的所有可枚举属性复制到目标对象上（target）。
           使用方式：Object.assign(target, source1, source2, …, sourceN)

    let target = { x: 1};
    let s1 = { y: 2 };
    let s2 = { z: 3 };
    Object.assign(target, s1, s2); // {x: 1, y: 2, z: 3}

注意点
1、如果目标对象与源对象用同名属性，或多个源对象具有同名属性，则后面的属性会覆盖前面的属性：

    let target2 = { x: 1};
    let s3 = { x: 3, y: 2 };
    let s4 = { y: 4,  z: 3 };
    Object.assign(target2, s3, s4); // {x: 3, y: 4, z: 3}

2、如果参数不是对象，则会先转成对象，在返回：

    typeof Object.assign(3); // "object"

3、若参数中有undefined 或者 null，这两个参数不能放在目标对象的位置，否则会报错：

    Object.assign(undefined); // Cannot convert undefined or null to object at Function.assign (<anonymous>)
    Object.assign(null); // Cannot convert undefined or null to object at Function.assign (<anonymous>)

4、除了字符串会以数组的形式复制到目标对象上，其他值都不会产生效果：

    let a1 = 'yuan';
    let a2 = true;
    let a3 = 11;
    let a4 = NaN;
    Object.assign({}, a1, a2, a3, a4); // {0: "y", 1: "u", 2: "a", 3: "n"}

5、Object.assign()这个方法是对对象引用的复制，即是浅复制，而不是深复制。这里需要规避同名属性替换带来的问题：

    var obj1 = { a: { b: 3, c: 4 } };
    var obj2 = { a: { b: "yuan" } } ;
    Object.assign(obj1, obj2); // { a: { b: "yuan" } }
    obj1.a.b; // "yuan"

基本用途

• 给对象添加属性

    class Geo {
      constructor(x, y) {
       Object.assign(this, x, y);
      }
    }

• 给对象添加方法

    Object.assig(SomeClass.prototype, {
      someMethod(arg1, arg2) { ... },
      anotherMethod() { ... }
    })

• 克隆对象

    function clone(originObj) {
      return Object.assign({}, originObj); // 将原始对象复制给空对象
    }

• 合并多个对象

    const mergeObjs = {
      (target, ...sources) => Object.assign(target, ...sources);
    }

• 为属性指定默认值

    const DEFAULTS = {
      logleve: 0,
      outputFormat: 'html'
    };
    function processContent(options) {
     retrun Object.assign({}, DEFAULTS, options);
    }