JavaScript之assign()——对象浅拷贝 (ES6)

浅拷贝的使用

浅拷贝可以使用方法 

Object.assign(要复制的对象)。

例如:

 1 var person = {
 2     name: '张三',
 3     age: 27,
 4     city: {
 5         name: '北京',
 6         code: '110000'
 7     }
 8 };
 9 var person2 = {};
10 Object.assign(person2, person);
11 person2.name = '李四';
12 person2.city.postCode = '100000';
13 console.log("person=>", person);
14 console.log("person2=>", person2);

输出的person和person2值如下:

 

可以看到,以上代码修改了person2的 name 和 city.postCode 。查看返回值,很容易知道assign使用的浅拷贝。

 Object.assign() 是ES6新增的方法。那么 Object.assign() 通用吗?

什么是ES6 ?它通用吗?

 ECMAScript 6.0(以下简称ES6)是JavaScript语言的下一代标准,已经在2015年6月正式发布了。它的目标,是使得JavaScript语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

 所以,ES6 发布到现在已经足够长的时间了。那么,ES6支持什么浏览器呢?

目前,各大浏览器基本都支持ES6的新特性。其中FireFox和Chromed对ES6的新特性支持最好。IE7~IE11不支持ES6。

以下是各大浏览器支持版本、开始支持时间。

浏览器 Chrome Edge FireFox Safari Opera
支持版本 Chrome 55 Edge 14 FireFox 54 Safari 10 Opera 55
支持时间 2017年1月 2016年8月 2017年3月 2016年7月 2018年8月

Object.assign()方法

定义

用于将源对象的所有可枚举属性复制到目标对象中。

语法

Object.assign(target, source_1, ···)

参数说明

参数 描述
target 目标对象。源对象的枚举属性将复制到这里。
source_1, ···
源对象。要复制的对象。
  • 如果目标对象与源对象有同名属性,或者多个源对象有同名属性,则后面的属性会覆盖前面的属性。
  • 如果函数只有一个参数,当参数为对象时,直接返回该对象;当参数不是对象时,会先将参数转为对象,然后返回。
  •  null 和 underfined 不能转换为对象,所以会报错。
  • assign的拷贝属于浅拷贝。
  • 对于数组的处理,会将数组转换为对象,然后在进行属性复制。
Object.assign([2,3], [5]);  // [5,3]

这里,会先将数组 [2,3] 转换为对象 {0:2 ,1 :3} 然后再进行属性复制,所以源对象的 0 号属性覆盖了目标对象的 0。

用法实例

1 let target = {a: 1};
2 let object2 = {b: 2};
3 let object3 = {c: 3};
4 Object.assign(target,object2,object3);  
5 // 第一个参数是目标对象,后面的参数是源对象
6 target;  // {a: 1, b: 2, c: 3

参考网址

有志者,事竟成,破釜沉舟,百二秦关终属楚; 苦心人,天不负,卧薪尝胆,三千越甲可吞吴。
原文地址:https://www.cnblogs.com/luyj00436/p/15177028.html