1. 属性的简洁表示法

如果属性和属性名相同，则可以写成一个，另外，函数作为属性的时候，可以省略 function 关键字，如下所示。

let birth = '2000/01/01';
const Person = {
  name: '张三',
  // 等同于 birth: birth
  birth,
  // 等同于 hello: function(){}
  hello () {
    console.log('我的名字叫', this.name);
  }
}

2. Object新增的方法

Object.is()

比较两个值是否相等。ES5 中有两个运算符 == 和 ===。但是他们呢都有缺点，前者会自动转换数据类型，后者的 NaN 不等于自身，以及 -0 等于 +0。
ES6 中用来严格表两个值是否相等，与 === 基本一致。

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

Object.assign()

基本用法

Object.assign 方法用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）。

const target = { a: 1, b: 1 };

const source1 = { b: 2, c: 2 };
const source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

Object.assign 方法的第一个参数是目标对象，后面的参数都是源对象。注意，如果目标对象与源对象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性。

参数不是对象的处理

如果该参数不是对象，则会先转成对象，然后返回。如果无法转成对象，则会报错，比如 undefined 和 null

typeof Object.assign(2) // "object"
Object.assign('abc'); // {0: 'a', 1: 'b', 2: 'c'}
Object.assign(undefined) // 报错
Object.assign(null) // 报错

浅拷贝

Object.assign 方法实行的是浅拷贝，而不是深拷贝。也就是说，如果源对象某个属性的值是对象，那么目标对象拷贝得到的是这个对象的引用。

const obj1 = {a: {b: 1}};
const obj2 = Object.assign({}, obj1);
obj1.a.b = 2;
obj2.a.b // 2

上面代码中，源对象obj1的a属性的值是一个对象，Object.assign 拷贝得到的是这个对象的引用。这个对象的任何变化，都会反映到目标对象上面。

同名属性对象的替换

对于这种嵌套的对象，一旦遇到同名属性，Object.assign 的处理方法是替换，而不是添加。

const target = { a: { b: 'c', d: 'e' } }
const source = { a: { b: 'hello' } }
Object.assign(target, source) // { a: { b: 'hello' } }

const target = {a: [1, 2, 3]};
const source = {a: [1, 4, 5]};
Object.assign(target, source); // {a: [1, 4, 5]}

上面代码中，target 对象的 a 属性被 source 对象的 a 属性整个替换掉了，而不会得到 { a: { b: 'hello', d: 'e' } } 的结果。

数组的合并

Object.assign 可以用来处理数组，但是会把数组视为对象。

Object.assign([1, 2, 3], [4, 5]) // [4, 5, 3]

上面代码中，Object.assign 把数组视为属性名为 0、1、2 的对象，因此源数组的 0 号属性4覆盖了目标数组的 0 号属性1。

Object.keys()

ES5 引入了 Object.keys 方法，返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（enumerable）属性的键名。

let obj = {foo: 'bar', name: 'tom'};
Object.keys(obj); // ['foo', 'name']

Object.values()

Object.values 方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（enumerable）属性的键值。

let obj = {foo: 'bar', name: 'tom'};
Object.values(obj); // ['bar', 'tom']

const obj = { 100: 'a', 2: 'b', 7: 'c' };
Object.values(obj); // ["b", "c", "a"]

上面代码中，属性名为数值的属性，是按照数值大小，从小到大遍历的，因此返回的顺序是 b、c、a。

Object.entries()

Object.entries 方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（enumerable）属性的键值对数组。

let obj = {foo: 'bar', name: 'tom'};
Object.entries(obj); // [['foo', 'bar'], ['name', 'tom']]

JS-学习ES6之-对象的扩展

目录