ES6 学习笔记之对象的新增方法

1. Object.is()

ES5 比较两个值是否相等，只有两个运算符：相等运算符（==）和严格相等运算符（===）。它们都有缺点，前者会自动转换数据类型，后者的 NaN 不等于自身，以及 +0 等于 -0.

Object.is() 是用来比较两个值是否严格相等，与严格比较运算符的行为基本一致。不同之处只有两个：+0 不等于 -0；NaN等于自身。

Object.is('foo', 'foo') //true
Object.is({}, {})   //false

//与 === 的不同之处
+0 === -0   //true
NaN === NaN //false

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

ES5 实现 Object.is 方法

Object.defineProperty(Object, 'is', {
    value: function(x, y){
        if(x === y){
            return x !== 0 || 1 / x === 1 / y;
        }
        return x !== x && y !== y;
    },
    configurable:true,
    enumberable: false,
    writable: true
});

上面代码中，如果 x === y，那么我们首先要排除 +0 === -0 的情况：x !== 0 排除 x 非 0 的情况，不是 0 就直接返回true；如果为 0 ，则进行 1/0 === 1/0 ,返回 true。1/+0 =Infinite，1/-0=-Infinite，通过这样来判断 +0 和 -0 不相等。判断 NaN 与 NaN，我们知道 NaN 与自身是不等的，因此我们可以通过 x !== x && y !== y 来判断。

2. Object.assign()

基本用法

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

Object.assign 方法的第一个参数是目标对象，后面的参数都是源对象。

注意，如果目标对象与源对象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性。如果只有一个参数，Object.assign 会直接返回该参数。如果该参数不是对象，则会先转成对象，然后返回。

const target = {a:1};
const source = {b:2};
const source2 = {c:3};
//Object.assign 方法的第一个参数是目标对象，后面的都是源对象
Object.assign(target, source, source2); //{a: 1, b: 2, c: 3}

const t = {a:1, b:2};
const t2 = {x:10, y: 11}
const t3 = {f:0, g:1}
const s1 = {b:3, c:4};
const s2 = {c:5};

//目标对象与源对象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性
Object.assign(t, s1, s2)    //{a: 1, b: 3, c: 5}

//如果只有一个参数，会直接返回该参数
Object.assign(t2)   //{x: 10, y: 11}

//如果该参数不是对象，则会先转成对象，然后返回
Object.assign(1)    //{1}
Object.assign('hello')  //{"hello"}

//undefined,null无法转成对象，会报错；但如果它们不出现在首参数，就不会报错，会直接跳过它们
Object.assign(undefined)    //报错
//Object.assign(null) //报错
Object.assign(t2, undefined, s2)    //{x: 10, y: 11, c: 5}

//数值，布尔值不在首参数，会被跳过
Object.assign(t3, 1, s1)    //{f: 0, g: 1, b: 3, c: 4}

//不在首参数的字符串会以数组的形式，拷贝入目标对象
Object.assign(t, 'hi')  //{0: "h", 1: "i", a: 1, b: 3, c: 5}

Object.assign 拷贝的属性是有限制的，只拷贝源对象的自身属性（不拷贝继承属性），也不拷贝不可枚举的属性。

属性名为 Symbol 值的属性，也会被 Object.assign 拷贝。

注意点：

浅拷贝
如果源对象某个属性的值是对象，那么目标对象拷贝得到的是这个对象的引用
同名属性的替换
对于嵌套的对象，一旦遇到同名属性，Object.assign 的处理方法是替换，而不是添加
```
const target = {a : {b:1, c:2} };
const source = {a : {b:2}};
Object.assign(target, source)   //{a: {b: 2}}
```

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

//把数组视为属性名为0,1,2的对象，因此源数组的0号属性覆'x'盖了目标数组的0号属性1
Object.assign([1,2,3], ['x', 'y'])  //["x", "y", 3]

取值函数的处理
Object.assign 只能进行值的复制，如果复制的值是一个取值函数，那么将求值后再复制。
```
const target = {};
Object.assign(target, source)   //{foo: 1}
```

常见用途

为对象添加属性

//将属性 x,y 添加到 Point 类的对象实例
class Point {
    constructor(x, y){
        Object.assign(this, {x, y});
    }
}

为对象添加方法

//直接将两个函数放在大括号中，再用 assign 方法添加到SomeClass.prototype中
Object.assign(SomeClass.prototype, {
    someMethod(arg1,arg2) {
        //...
    },
    anotherMethod() {
        //...
    }
});

克隆对象
合并多个对象
为属性指定默认值

ES6 学习笔记之对象的新增方法

相关推荐