1、对象

1、对象的书写形式

      let name = '小陈同学';
      let age = 23;
      let obj = {
        name:name,
        age:age,
        fn:function(){
          return this.name
        }
      }
      //ES写法
      let obj = {
        name,
        age,
        fn(){
          return this.name
        }
      }

1.2、属性名表达式

定义对象的属性，有两种方式

// 写法一
obj.name = '小陈同学';

// 写法二
obj['name'] = '小陈同学'

在ES6中拓展了ES5的缺陷，在使用字面量定义对象时，ES5只允许第一种方式去定义，比如：

let  obj = {
    name:'小陈同学',
    age:22
}

而ES6中拓展了它的定义方式，允许第二种方式去字面量的方式去定义对象

let  obj = {
    ['name'] : '小陈同学',
    ['age']: 22
}

其次还允许这种方式去定义对象内部的方法名

let  obj = {
    ['name']:'小陈同学',
    ['fn'](){
        return 1;
    }
}

但是需要注意的是，这种写法不支持简写，比如：

      //第一种方式
      let name = '小陈同学';
      let age = 23;
      //ES简写的写法
      let obj = {
        name,
        age,
        fn(){
          return this.name
        }
      }
      console.log(obj.fn()); // 打印结果 小陈同学

      // 第二种方式
      let username = '小yu同学';
      let userage = 22;
      let obje = {
        //切记不支持简写！！！！
        [username]:[username],
        [userage]:[userage],
        ['fn'](){
          return obje[username];
        }
      }
      console.log(obje.fn())

第二种写法一定不要去简写，会报错！！！

2、对象新增

2.1、Object.is() 用来比较两个值是否相等

ES5比较两个值是否相等，只有两个运算符：相等运算符（==）以及严格相等运算符（===）。它们都有自身的缺点，前者会自动转换数据类型，比如：123 == '123' 相等运算符会自动处理为true值，隐形的进行了数据类型的转换，而后者严格相等运算符的NaN不等于自身，以及+0等于-0。
ES6提出同值相等算法，Object.is()就是部署这个算法的新方法，它用来比较两个值是否严格相等，类似于严格相等运算符（===）的提升。

      let obj1 = Object.is(123,'123');
      console.log(obj1);// false
      let obj2 = Object.is(NaN,NaN);
      console.log(obj2);// true
      let obj3 = Object.is(+0,-0);
      console.log(obj3);// false

执行结果.png

2.2、Object.assign()用来合并对象的

使用方法：let  新对象 = Object.assign(目标对象，需要合上的对象)

使用示例

      let json = {
        name:'小陈同学',
        age:22,
        addr:'湖南省长沙市'
      }
      let newjson = {
        score:100,
        isShow:true
      }
      let jsons = Object.assign(json,newjson);
      console.log(jsons);

打印结果.png

2.2.1、如果属性名有重复的

如果在合并对象的时候属性名有重复的，那么后面的就会去覆盖前面的

      let json = {
        name:'小陈同学',
        age:22,
        addr:'湖南省长沙市'
      }
      let newjson = {
        name:'小yu同学',
        addr:'安徽省芜湖市',
        score:100,
        isShow:true
      }
      let jsons = Object.assign(json,newjson);
      console.log(jsons);

执行结果.png

2.2.2、如果Object.assign()中只有一个参数，Object.assign()会直接返回该参数

      let json = {
        name:'小陈同学'
      }
      let jsons = Object.assign(json);
      console.log(jsons);

执行结果.png

2.2.3、由于undefined和null无法转成对象，所以如果它们作为参数，就会报错。

Object.assign(undefined)//报错
Object.assign(null)//报错

2.2.4、利用Object.assign()这个方法来拷贝数组

      let arr = [1,2,3];
      let array = new Set(Object.assign([],arr));    //为了能链式的去添加元素，偷个懒...
      array.add(4).add(5).add(6).add(7).add(8);
      console.log('新数组：',array);
      console.log('旧数组：',arr)

执行结果.png

3、Object.keys()、Object.entries()以及Object.values()

用于循环json和对象

3.1、Object.keys()

遍历json的属性

      let json = {
        name: "小yu同学",
        addr: "安徽省芜湖市",
        score: 100,
        isShow: true,
      };

      for(let item of Object.keys(json)){
        console.log(item);
      }

执行结果.png

3.2、Object.values()

遍历json的属性值

      let json = {
        name: "小yu同学",
        addr: "安徽省芜湖市",
        score: 100,
        isShow: true,
      };

      for(let item of Object.values(json)){
        console.log(item);
      }

执行结果.png

3.3、Object.entries()

遍历键值对

      let json = {
        name: "小yu同学",
        addr: "安徽省芜湖市",
        score: 100,
        isShow: true,
      };

      for(let item of Object.entries(json)){
        console.log(item);
      }

执行结果.png
也可以使用解构去做

      let {keys,values,entries} =Object

      let json = {
        name: "小yu同学",
        addr: "安徽省芜湖市",
        score: 100,
        isShow: true,
      };
      for(let item of keys(json)){
        console.log(item); //name  addr  score  isShow
      }
      for(let item of values(json)){
        console.log(item);//小yu同学  安徽省芜湖市  100  true
      }
      for(let item of entries(json)){
        console.log(item);//[name: "小yu同学"]  [addr: "安徽省芜湖市"] [score: 100]  [isShow: true],
      }

4、对象的扩展运算符

4.1、解构赋值与...（扩展运算符）

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x // 1
y // 2
z // { a: 3, b: 4 }

由于解构需要等号两边匹配一致，因此，左边是对象，而右边不是一个对象，那么就会出现报错。

4.1.1、解构赋值必须要放到最后一个参数，否则报错

let  {...x,y,z} = obj //报错

let  {x,...y,...z} = obj //报错

let  {x,y,...z} = obj //正确

注意：解构赋值的拷贝是浅拷贝，即如果一个键的值是复合类型的值（数组、对象或是函数），那么解构赋值拷贝的是这个值的引用，而不是这个值的副本。比如：

      let obj = {
        name:'小陈',
        age:22,
        x:{
          addr:'安徽省芜湖市'
        }
      }
      console.log(obj.x.addr);
      let {x,...b} = obj;
      console.log(x.addr);

打印结果.png

指向的是同一个引用对象

4.1.2、扩展运算符可以拷贝对象

扩展运算符可以拷贝对象用于取出参数对象的所有可遍历的属性，拷贝到当前对象之中。

      let a = {x:1,y:2,z:3}
      let c = {...a};
      console.log(c)

执行结果.png