ES6的Object.assign()

ES6新增了很多语法,今天我们来详细了解一下Object对象的新方法assign();

使用方法:

我们之前需要拷贝一个对象的属性的时候是这样的:

var a = { aa: "123" };

var b = { bb: "456" };

var c = { cc: "789" };

c.aa = a.aa;
c.bb = b.bb;

// 结果: c = {cc: "789", aa: "123", bb: "456"}

如上所示,这是我们以前常用的属性赋值,但是有了Object.assign()后可以这样:

var a = { aa: "123" };

var b = { bb: "456" };

let c = Object.assign({ cc: "789"}, a, b);

// 结果: c = {cc: "789", aa: "123", bb: "456"}

 这样一下,瞬间省了很多代码,而且更加清晰明了有木有。并且,它还能够给默认值,例如:

let a = { aa: "123" };

let b = Object.assign( {bb="111",aa="222"}, a);

///结果b = {bb: "111", aa: "123"}

 如果目标对象中有属性与源对象相同的属性,那么最后将会覆盖掉目标对象中的属性值,也就是后面的相同属性会覆盖掉前面的属性值。

注意:

网上对于Object.assign()的说法不一致,有的说的深拷贝有的说是浅拷贝,当然官方说的是浅拷贝,但是,做了如下测试后:

let a = { aa: "123", ab: "34", ac: 12 };

let b = Object.assign({},a);

b.aa = "456";

// 结果 a = {aa: "123", ab: "34", ac: 12};
//      b = {aa: "456", ab: "34", ac: 12};

哎,这结果就很有趣了,这明明就是深拷贝啊,再看看下面的例子:

let a = { aa: "123", ab: { abb: "456"}};

let b = { bb: "789" };

let c = Object.assign({}, b, a);

c.ab.abb = "111111";

//结果: c = { aa: "123", ab: {abb: "111111"}, bb: "789" };
        b = { bb: "789" };
        a = { aa: "123", ab: { abb: "111111"}};

是不是发现a的ab属性变了?这是怎么回事呢?

官方的说法是:Object.assign()只会从来源物件将自身可列举的属性复制都目标物件。

我的理解是:Object.assign()只会复制源对象的属性值,如果属性值是的数据类型是基本数据类型(string,number等)的话,将会直接复制值,如果是引用数据类型(object,array)的话,它只会复制源对象属性的引用。

所以对于Object.assign是深拷贝还是浅拷贝这种问题不必太过于去深究,我们只要知道它在什么样的情景下才能够使用就行了。

这里我也提供了一种对象的深拷贝的方法,很简单:

let newobj = JSON.parse(JSON.stringify(obj));

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

专业前端小白

写了这么久文章,1分钱都没收到

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值