9.对象的拓展

对象的扩展

一.属性和方法的简洁表示

1. ES6为对象的属性和方法增加了更为简洁的表示方法

2. ES6允许在对象中，直接写变量，变量名为对象的属性名，变量的值为对象属性的值

   var name = 'hello';
   var age = 18;
   
   var obj = {
       name,
       age
   }
   
   =>等价于
   var obj = {
       name:'hello',
       age:18
   }

3. 方法的简写方式

   var obj = {
       sayHello:function(){
           alert("hello!");
       }
   }
   
   =>
   
   var obj = {
       sayHello(){
           alert('hello');
       }
   }

二.属性名表达式

1. ES6允许字面量定义对象时，用表达式作为对象的属性名，即把表达式放在方括号内

   • 注意：属性名简洁法和属性名表达式不可以同时使用，会报错

   var first = 'firstName';
   var obj = {
       ['na' + 'me']:'小明',
       ['first']:'欧阳'
   }
   
   =>
   var obj = {
       name:'小明'
       firstName：'欧阳'
   }

2. 表达式还可以用来定义方法名

   var obj = {
       ['say' + 'Hello'](){
           alert('hello');
       }
   }

三.属性的可枚举和遍历

1. 属性的可枚举性

• 对象的每一个属性都有一个描述对象（Descriptor)，用来控制该属性的行为，Object.getOwnpropertyDescriptor方法可以获取该属性的描述对象

let obj = {foo:'123'}
Object.getOwnPropertyDescriptor(obj,'foo');
//返回
{
    configurable: true，
    enumerable: true，
    value: 123，
    writable: true，
    __proto__: Object
}

• 描述对象的 enumerable属性，称为可枚举性，如果该属性为false，表示某些操作会忽略当前属性
• 目前，有四个操作会忽略 enumerable 属性为 false的情况
  • for...in循环，只遍历对象自身的和可继承的可枚举属性
  • Object.keys()，返回对象自身的所有可枚举属性的键名
  • JSON.stringify（），只串行化对象自身的可枚举属性
  • Object.assign（），忽略 enumerable 为false的属性，只拷贝对象自身可枚举的属性

2. 属性的遍历

• ES6一共有5种方法可以遍历对象的属性
  • for...in：循环遍历自身的可继承的可枚举属性
  • Object.keys()：返回一个数组，包含对象自身的所有可枚举属性（不含继承的）
  • Object.getOwnPropertyNames(obj)：返回一个数组，包含对象自身的所有属性的键名（包括不可枚举属性）
  • Reflect.ownKeys(obj)：返回一个数组，包含对象自身所有的键名

四.super关键字

1. ES6新增一个super关键字，指向当前对象的原型对象
2. super关键字表示原型对象时，只能用在对象的方法中，用在其他地方会报错

//报错，用在属性上
const obj = {
    foo:super.foo
}

//报错，用在函数，但是赋值给了属性
const obj = {
    foo:() => super.foo
}

//报错，用在函数，但是赋值给了属性
const obj = {
    foo:function(){
        return super.foo
    }
}

五.对象的拓展运算符

1. 解构赋值

• 由于解构赋值要求右边是一个对象，所以如果等号右边是undefined或者null，就会报错

//报错
let {...x} = null;
let {...x} = undefined;

• 解构赋值必须是最后一个参数，否则报错

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

• 注意：解构赋值的拷贝为浅拷贝，即如果一个键的值是复合类型的值，那么拷贝的是这个值的引用，而不是这个值的副本

六.对象的新增方法

1. Object.is（）

• 判断两个值是否相等，类似于 ===

2. Object.assign（）

• 用于对象的合并，将源对象的所有可枚举属性，复制到目标对象
  • 注意：
  • 浅拷贝
  • 同名属性的替换
  • 可以用来处理数组，但是把数组当对象
  • 如果复制的是一个取值函数，那么会求值后再复制
• 用途：
  • 为对象添加属性
  • 为对象添加方法
  • 克隆对象
  • 合并多个对象

3. Object.getOwnPropertyDescriptor

• 返回对象属性的描述对象

4. _proto_属性

• Object.setPrototypeOf（）：设置一个对象的原型对象
• Object.getPrototypeOF（）：读取一个对象的原型对象

5. Object.keys(),Object.values(),Object.entries()

• Object.keys()：获取对象的键值数组
• Object.values()：获取对象的属性值数组
• Object.entries()：获取对象的键值数组

6. Object.fromEntries

• 该方法是Object》entries的逆操作，将数组转换为对象

总结

1. 在ES6中，对象的属性和方法可以采用简洁的表示方法
2. 对象的属性名可以采用表达式的方式来设置
3. 对象的每一个属性，都拥有可枚举和遍历的属性
4. super关键字，可以用来获取原型对象的属性，但是只能用在对象内置的方法中
5. 对象的扩展运算符，同数组
6. 对象新增了一些方法，了解即可，具体需要用到的时候，再详细查看