Object.assign如何在JavaScript中使用

　　介绍

这篇文章将为大家详细讲解有关对象。分配如何在JavaScript中使用,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。

<强>深拷贝与浅拷贝

在JavaScript中,对于基本数据类型(未定义,null,布尔、数字、字符串)来说,在变量中存储的就是这个变量本身的值,复制是对<强>值的复制强,不存在深浅之说。但C系语言的共同特点中有,存储引用类型(对象),实际中在变量里存的是它的地址。因此对JavaScript中的复杂数据类型(对象)来说,也会有浅拷贝和深拷贝的概念:<强>浅拷贝指两个不同的变量存的是同一个对象的地址,即两个变量指向同一块内存区域;深拷贝则是重新分配了一块内存区域来存储复制后的对象,两个变量存的是真正的两个互不影响的变量。

注。有些资料认为<强>浅拷贝是重新分配内存,并把原对象中的各个属性进行依次复制而不进行递归复制属性值是对象的情况,也就是只复制对象的最外面一层强。本文将这种情况归于“深拷贝和浅拷贝的中间情况”,文中以“是否划分新的内存”为界限划分深浅拷贝,这种划分方式与C/c++, c#、Java等C系语言保持概念一致。

<强>浅拷贝在JavaScript中的实现

浅拷贝在js中很简单,例如:

let  objA =, { 　　,,名字:& # 39;对象一个# 39;, 　　,,内容:& # 39;我是一个# 39; 　　}; 　　let  copyA =, objA; 　　console.log (objA.name);,//,==祝辞,“对象A" 　　console.log (copyA.name);,//,==祝辞,“对象A"

如此即得到了objA的一份浅拷贝copyA,由于指向的是同一个对象,因此在修改objA的同时也是修改了copyA,反之亦然。

<强> Object.assign()

Object.assign(目标,…来源)MDN上对该方法的描述是<强>将所有可枚举属性的值从一个或多个源对象复制到目标对象强,字符串类型和符号类型的属性都会被拷贝,并且<强>该方法会忽略值为或者未定义的源对象强。例如:

var  o1 =,{,答:1,}; 　　var  o2 =,{,[符号(& # 39;foo # 39;)]:, 2,}; 　　var  obj =, Object.assign ({},, o1,, o2); 　　console.log (obj);,//, {, a :, 1日,[符号(“foo")]:, 2,}, (cf只bug  1207182,提醒Firefox) 　　Object.getOwnPropertySymbols (obj);,//,[符号(foo)]

<强>对象。分配的深拷贝与浅拷贝

注意前面说的是可枚举属性,这是一个介于完全的深拷贝和完全的浅拷贝之间的方法:如果我们把它的第一个参数目标设置为一个空对象{},同时保证剩余的源对象中来源的属性类型不包含引用类型,则该方法的返回值就是一个与源对象相同的但并不在同一块内存空间另一个对象,即获得了源对象的深拷贝。但是,如果源对象的属性中包含某个对象,也就是这个属性的值指向某个对象,就像下面这样:

var  obj =, { 　　,,名字:& # 39;obj 名字# 39; 　　,,内容:{ 　　,,,,,, 　　,,,b: 2 　　,,} 　　};

则使用<代码>对象。分配({},obj) 时,返回的目标对象中的内容属性与源对象obj中的内容属性指向的同一块内存区域,即对obj下的内容属性进行了<强>浅拷贝强。因此针对深拷贝,需要使用其他方法,比如自己实现一个深拷贝的方法,或者使用<代码> JSON.parse (JSON.stringify (obj))> Object.assign()>

<强>对象。分配的属性覆盖

如果目标对象中的属性具有相同的键,则属性将被源中的属性覆盖。后来的源的属性将类似地覆盖早先的属性,因此可以用来合并对象(常用的一个场景是使用还原剂更新反应应用的状态)。

var  o1 =, {,, 1,,,,,,,, 1,}; 　　var  o2 =, {, b: 2, c:, 2,}; 　　var  o3 =, {, c: 3,}; 　　var  obj =, Object.assign ({},, o1,, o2,, o3); 　　console.log (obj);,//, {,, 1,,,,,,,, 3,}

<强>关于对象的继承属性和不可枚举属性

前文有提到,<代码>对象。分配> [[有]]> [[设置]]> getter 和<代码>设置> Object.getOwnPropertyDescriptor()

Object.assign如何在JavaScript中使用