JavaScript Object 静态方法之 Object.assign()

471 2 年前
Object.assign()是Javascritp中Object的静态方法,作用是将来自一个或多个源对象中的可枚举自有属性值复制到一个目标对象。

将来自一个或多个源对象中的值复制到一个目标对象。返回目标对象,仅可枚举自有属性从源对象复制到目标对象 ,null 或 undefined 源被视为空对象一样对待

Object.assign(target, ...sources );

var first = { name: "Bob" };
var last = { lastName: "Smith" };

var person = Object.assign(first, last);
console.log(first);//{ name: 'Bob', lastName: 'Smith' }
console.log(person);//{ name: 'Bob', lastName: 'Smith' }
console.log(first === person);//true

从上面的例子中可以看出,target 改变了,返回的结果和target指向地址都一样。

这里请注意 可枚举自有属性

1、可枚举的属性

在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的。enumerabletrue表求可枚举,能用for…in遍历出来。

2、自有属性

区别于原型属性,不是从原型链继承而来的

var obj = Object.create({ foo: 1 }, {//create建立的对象,obj里foo是继承来的
  bar: {
    value: 2 //enumerable没指定,默认为false
  },
  baz: {
    value: 3,
    enumerable: true
  }
});

var copy = Object.assign({}, obj);
console.log(copy); // { baz: 3 }
var v1 = "abc";
var v2 = true;
var v3 = 10;
var v4 = Symbol("foo");
var v5 = ['xx','yy'];

var obj = Object.assign({}, v1, null, v2, undefined, v3, v4,v5);
// 原始类型会被包装,null 和 undefined 会被忽略。
// 注意,原始数据类型只有字符串的包装对象才可能有自身可枚举属性。
console.log(obj); // { '0': 'xx', '1': 'yy', '2': 'c' }

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

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

Object.assign合并复制属性时,如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。上面的例子在复制v5之前为{ "0": "a", "1": "b", "2": "c" },然而 v5类似{ "0": "xx", "1": "yy"},覆盖了同名的属性。

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

如果只有一个参数,且这个参数是一个对象,Object.assign会直接返回该参数。

var obj = {a: 1};
Object.assign(obj) === obj // true

如果只有一个参数,且这个参数为不是undefined和null的原始类型,Object.assign会直接返回该参数的包装对象。

typeof Object.assign(2) // "object"

如果只有一个参数,且这个参数为是undefined和null,Object.assign报错。

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

源对象参数是原始类型,只有字符串以数组形式复制到目标对象,其他的都跳过。

let obj = {a: 1};
Object.assign(obj, undefined) === obj // true
Object.assign(obj, null) === obj // true

var v1 = 'abc';
var v2 = true;
var v3 = 10;
var obj = Object.assign({}, v1, v2, v3);
console.log(obj); // { "0": "a", "1": "b", "2": "c" }
分类栏目
© 2018邮箱:11407215#qq.comGitHub沪ICP备12039518号-6