ES6 Object.assign( )方法的使用

前言:在最近的项目中经常使用到,也挺好用的达到了想要的结果,接下来介绍Object.assign()方法的基本使用。

一、基本语法

Object.assign(target, ...sources)

二、基本概念

Object.assign方法用来将源对象(source)的所有可枚举属性,复制到目标对象(target)。Object.assign拷贝的属性是有限制的,只拷贝源对象的自身属性(不拷贝继承属性),也不拷贝不可枚举的属性(enumerable: false)。一般至少需要两个对象作为参数,第一个参数是目标对象,后面的参数都是源对象。

三、基本用途

  1. 合并多个对象
  2. 注:如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。

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

    注:如果只有一个对象参数,那么就返回源对象。

    let targetObj1 = { a: 4 }
    Object.assign(targetObj1);
    console.log(Object.assign(targetObj1))  //返回{a:4}

    注:如果该参数不是对象,则会先转成对象,然后返回。如果参数是null和undefined则会报错。

    console.log((Object.assign(2)));  //Number{2}
    console.log((Object.assign('')));  //String{''}
    console.log((Object.assign(null)));  // 报错"TypeError: Cannot convert undefined or null to object"
    console.log((Object.assign(undefined)));  //报错"TypeError: Cannot convert undefined or null to object"

    注意:如果非对象参数出现在源对象的位置(即非首参数),那么处理规则有所不同。首先,这些参数都会转成对象,如果无法转成对象,就会跳过。这意味着, 如果undefined和null不在首参数,就不会报错。其他类型的值(即数值、字符串和布尔值)不在首参数,也不会报错。但是,除了字符串会以数组形式,拷贝入目标对象,其他值都不会产生效果。

  3. 克隆对象
  4. enterExperts: Object.assign({}, this.demand.enterExperts)

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

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

    console.log(obj1.a.b = 2) ; //2
    console.log(obj2.a.b) ;// 2
  5. 为对象添加属性
  6. class Point {
      constructor(a, b) {
        Object.assign(this, {a, b});
      }
    }

    上面方法通过Object.assign方法,将a属性和b属性添加到Point类的对象实例。

  7. 为对象添加方法
  8. Object.assign(SomeClass.prototype, {
      someMethod(arg1, arg2) {
        ···
      },
      anotherMethod() {
        ···
      }
    });

    // 等同于下面的写法
    SomeClass.prototype.someMethod = function (arg1, arg2) {
      ···
    };
    SomeClass.prototype.anotherMethod = function () {
      ···
    };

    上面代码使用了对象属性的简洁表示法,直接将两个函数放在大括号中,再使用assign方法添加到SomeClass.prototype之中。

 
对于嵌套的对象,Object.assign的处理方法是替换,而不是添加。

var target = { a: { b: 'c', d: 'e' } }
var source = { a: { b: 'hello' } }
console.log( Object.assign(target, source))

上面代码中,target对象的a属性被source对象的a属性整个替换掉了,而不会得到{ a: { b: ‘hello’, d: ‘e’ } }的结果。这通常不是开发者想要的,需要特别小心。有一些函数库提供Object.assign的定制版本(比如Lodash的_.defaultsDeep方法),可以解决深拷贝的问题。

非著名均为来自网络,不代表一点新作立场,若为著名原创,转载请注明出处:http://ydxinzuo.cn/archives/1411

作者: Webmaster

发表评论

邮箱地址不会被公开。 必填项已用*标注

联系我们

联系我们

在线咨询: QQ交谈

邮箱: 303817524@qq.com

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

关注微博
返回顶部