ES6 --- 对象扩展

对象扩展主要从四个方面开展：

1.简洁表示法
2.属性表达式
3.扩展运算符
4.Object新增方法

一、简洁表示法

{
    // 简洁表示法
    let o =1;
    let k=2;
    let es5= {
        o:o,
        k:k
    };
    let es6={
        o,
        k
    };
    console.log(es5,es6);
    //Object {k:2,0:1}
    //Object {k:2,0:1}  
}

在es5中，我们去定义对象，多使用键值对的方式来定义，在es6中，我们直接使用变量名称来定义就可以了。是不是比之前的写法简单很多，我们看看打印的结果，两个对象是一样的。只是写法上不同而已，其他的都是一样的。

下面，我们来看看方法是怎么定义的：

{
    // 简洁表示法

    let es5_method = {
        hello: function(){
            console.log('hello')
        }
    };

    let es6_method={
        hello(){
            console.log('hello')
        }
    };

    console.log(es5_method.hello(), es6_method.hello());// hello hello
}

在es6中直接写方法，可以不用写function。我们看一下结果，也是一样的。

二、属性表达式

{
    // 属性表达式
    let a='b';
    let es5_obj = {
        a: 'c'
    };

    let es6_obj={
        [a]: 'c'
    };

    console.log(es5_obj,es6_obj); // {a: 'c'}   {b:'c'}
}

在es5中，属性值K是一个估定值。在es6中，K值是可以是一个变量的，使用[]包裹的变量。我们看到打印的结果，我们发现K值是b，所以在现实中，我们使用 [a] ，来实现变量的依赖。

三、新增API

{
    // 新增api
    console.log('字符串', Object.is('abc', 'abc'), 'abc'==='abc');// true true
    console.log('数组', Object.is([],[]),[]===[]); // false false

}

Object.is() ， 判断两个值是否相等，这个与 === 的功能是一样的。我们在使用字符串来判断的时候，都是true，再使用引用类型来测试时，两个数组的值不相等，打印的结果也是一样的。

{
    // 新增api
    console.log('拷贝',Object.assign({a:'a'}, {b:'b'})); // {a: "a", b: "b"}
}

Object.assign 可以复制对象，但是这个是浅拷贝。在使用时，Object.assign只会拷贝本身的属性，不可枚举的属性是不会拷贝的，原形链上的属性也不会拷贝。

{
    // 新增api
    let test = {k:123,o:456}

    for(let {key,value} of Object.entries(test)){
        console.log(key,value); // k 123 , o 456 
    }
}

Object.entries() 与数组的entries是差不多的，都是同时得到key值和value值，如过有想了解数组的es6扩展，请点这里

所以这里的一些方法我们就不具体说了，跟数组的扩展是类似的。

四、扩展运算符

{
    // 扩展运算符

    let {a,b,...c} = {a:'1',b:'2',c:'3',d:'4'};
    console.log(a,b,c);// 1  2 {c:3,d:4}
}

对象的扩展运算符和数组的扩展运算符也是类似的，但是现在对对象的扩展运算符的支持还不是很友好。得到的结果中我们可以看到，…c 这样的方式，会将右边对象中没有被左边获取的值都包括进去。