!D??Y^6bI 1.Object.assign()基本用法:
EF`}*7) =:]ps<Qx (;{X-c}? Object.assign方法用来将源对象(source)的所有可枚举属性,复制到目标对象(target)。它至少需要两个对象作为参数,第一个参数是目标对象,后面的参数都是源对象。
4IeCb? ~:DL{ZeEb h&0zR#t let targetObj1 = { a: 1 };
&,&+p0CSI! let sourceObj1 = { b: 1 };
!.vyzCJTzB let sourceObj11 = { c: 3 };
6w^P{%ul Object.assign(targetObj1, sourceObj1, sourceObj11);
0kE[=#'.' console.log(targetObj1);
.#( vx; 注:如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。
o[ 5dR< ^ij0<*ca9 hYJzF.DW<$ let targetObj1 = { a: 1, b: 2 };
TLwxP" let sourceObj1 = { b: 1 };
{-Y;! let sourceObj11 = { c: 3 };
!T0I; j& Object.assign(targetObj1, sourceObj1, sourceObj11);
Q#eMwM#~ console.log(targetObj1);
j9
nw,x$ 如果只有一个参数,Object.assign会直接返回该参数。
xM jn=\} NEq_!!/sF 3TwjC:Yhv2 let targetObj1 = { a: 4 }
)9eIo&Nl Object.assign(targetObj1);
hP6f console.log(targetObj1)
{$frR "K 如果该参数不是对象,则会先转成对象,然后返回。
SzW;Yb"#^k #UM,)bH rS1 gFGrj console.log(typeof (Object.assign(2)));
5H3o?x 由于undefined和null无法转成对象,所以如果它们作为参数,就会报错。
j)J |'b| 'va[)~! 0z=KnQx"4 console.log(typeof(Object.assign(null)));
I}8e"# $?GggP d console.log(typeof(Object.assign(underfind)));
Nc+0_|, 注意:如果非对象参数出现在源对象的位置(即非首参数),那么处理规则有所不同。首先,这些参数都会转成对象,如果无法转成对象,就会跳过。这意味着, 如果undefined和null不在首参数,就不会报错。其他类型的值(即数值、字符串和布尔值)不在首参数,也不会报错。但是,除了字符串会以数组形式,拷贝入目标对象,其他值都不会产生效果。
%1#\LRA( pBqf+}g4 j7!u;K^c Object.assign只拷贝自身属性,不可枚举的属性(enumerable为false)和继承的属性不会被拷贝。
//8W"> u Jn hdZa er3Mvw let obj1 = Object.assign({ dwb: 'zjl' },
~n
'A1 !S?Fz] Object.defineProperty({}, 'zmf', {
+^7cS6"L @5Tl84@Q enumerable: false,
P>_O :xD i#:To
|\u value: 'zmf'
9R=avfI :hICe+2ca })
"ku[b\W Le#srr )
i[z 2'tx4 SGKAx<U console.log(obj1);
O/eZ1YAC ->ZP.7 let obj2 = Object.assign({ dwb: 'zjl' },
CDJ@Tdp 7nPg2K& Object.defineProperty({}, 'zmf', {
@,<jPR. .]>Tj^1 enumerable: true,
]j0+4w |0ZJ[[2 value: 'zmf'
@.sn 4$^mLD$> })
@*rMMy 4 N:|``n> )
~Jf(M^E TJYhgna console.log(obj2);
7s^b@&Le 7mSNz. 对于嵌套的对象,Object.assign的处理方法是替换,而不是添加。
+8<$vzB ta95]|z"j (P E.v1T var target = { a: { b: 'c', d: 'e' } }
7a>+ma\ V|A)f@ Fs var source = { a: { b: 'hello' } }
A*BN
ms3" Object.assign(target, source);
Dlz0*eHD 上面代码中,target对象的a属性被source对象的a属性整个替换掉了,而不会得到{ a: { b: 'hello', d: 'e' } }的结果。这通常不是开发者想要的,需要特别小心。有一些函数库提供Object.assign的定制版本(比如Lodash的_.defaultsDeep方法),可以解决深拷贝的问题。
O!>#q4&] XRV~yBIS .0,G4k/yv ADF<5#I 5222"yn"c L_T+KaQCH 注意,Object.assign可以用来处理数组,但是会把数组视为对象。
x
[vbi pFs/ipZX^* mph9/ %]S console.log(Object.assign([1, 2, 3], [4, 5]));
Uo9@Y{<B 其中,4覆盖1,5覆盖2,因为它们在数组的同一位置,所以就对应位置覆盖了。
<8~c7kT' `
>>]$ZJ daCkjDGl\ w('}QB`xad t%,:L.?J# OZz/ip-!lc Object.assign方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用。
"PS ) "t jT]R"U/Q ^} Y}Iz var object1 = { a: { b: 1 } };
?.-+U~ g/FT6+&T. var object2 = Object.assign({}, object1);
ZmkH55Cn F_ -Xx" object1.a.b = 2;
* >:< 0dsL%G~/N console.log(object2.a.b);
lSoAw-@At8 2.用途
uT=5zu S|KUh|=Q hhWy-fP#
2.1为对象添加属性
9GT}_
^fb PQ;9iv I (k(p\l% *)?'! 2.2为对象添加方法
|+[Y_j Lr
d- ,h/l-#KS 0`v-pL0| 2.3克隆对象
o9C#5%9 function copyFnc(origin) {
Q`;eI
a6U `}L{gssv return Object.assign({}, origin)
@J qo'\~& Ejf5M\o }
p&4n"hC ;|$o z{Ll var sur = { a: 1, b: 2 };
Eht8~"fj H;q[$EUNb console.log(copyFnc(sur));
Nz*,m'-1e 上面代码将原始对象拷贝到一个空对象,就得到了原始对象的克隆。
Lp4F1H2t- p=kt+H&; k{hNv|:, 不过,采用这种方法克隆,只能克隆原始对象自身的值,不能克隆它继承的值。如果想要保持继承链,可以采用下面的代码。
[f[Wz{Q#Y %""h:1/S vM$hCV~N function clone(origin) {
Di}M\!-[ % -+7=x let originProto = Object.getPrototypeOf(origin);
%3"U|Za+ lkR^2P return Object.assign(Object.create(originProto), origin);
{X_I>)Wg d+ZXi' }
I _N:j,Mx
在JS里子类利用Object.getPrototypeOf去调用父类方法,用来获取对象的原型。
BSJS4+,E G K3T w >msQ@Ch X=lsuKREZ "68X+! HD2C^V2@M 2.4 合并多个对象
v<<ATs%w Yo=$@~vN] h+&iWb3; //多个对象合并到某个对象
V8&'dhuG . &`YlK o2hZ=+w> const merge = (target, ...sources) => Object.assign(target, ...sources);
xO<%lq` //多个对象合并到新对象
C+jXH)|iq |!7leL .X"&kO>G const merge = (...sources) => Object.assign({}, ...sources);
1LhZmv o:"(\$ m,62'
6gO(
8 2.5为属性指定默认值
'irwecd8 r$'.$k\ !b4AeiL>w const DEFAULTS = {
|`Yn'Mj8rm MU2kA&LH logLevel: 0,
v6Y[_1 0aI@m outputFormat: 'html'
.f. tPm ' S,g3 };
@JLN3 Vm8dX? function processContent(options) {
3
Fy CD4# gW4fwE^ let options = Object.assign({}, DEFAULTS, options);
k\*?<g CyHHV }
_h,_HW)G ————————————————
Q8QB{*4 版权声明:本文为CSDN博主「想要飞翔的小猪」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
n_ ?+QF 原文链接:
https://blog.csdn.net/dwb123456123456/article/details/83316471