Kd%>:E* 1.Object.assign()基本用法:
M9J^;3Lrh NW*qw q j\^u_D Object.assign方法用来将源对象(source)的所有可枚举属性,复制到目标对象(target)。它至少需要两个对象作为参数,第一个参数是目标对象,后面的参数都是源对象。
{R{Io| OQC.p,SO w?db~"T let targetObj1 = { a: 1 };
7K\H_YY8# let sourceObj1 = { b: 1 };
50Kv4a" let sourceObj11 = { c: 3 };
rQ!X Object.assign(targetObj1, sourceObj1, sourceObj11);
Z?o?"|o console.log(targetObj1);
~?x
`f+ 注:如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。
G"'[dL)N> s/=.a2\ dreEe s`| let targetObj1 = { a: 1, b: 2 };
faJ>,^V# let sourceObj1 = { b: 1 };
V(LE4P1 let sourceObj11 = { c: 3 };
IxxA8[^V Object.assign(targetObj1, sourceObj1, sourceObj11);
C6neZng console.log(targetObj1);
dAZh# i[ 如果只有一个参数,Object.assign会直接返回该参数。
sJHN4 EEJsNF a=!I(50 let targetObj1 = { a: 4 }
J|Xu]fg0 Object.assign(targetObj1);
\1p_6U7 console.log(targetObj1)
\EC=#E( 如果该参数不是对象,则会先转成对象,然后返回。
<g^!xX<r? NP {O xlH?J;$ console.log(typeof (Object.assign(2)));
^6Std
x_ 由于undefined和null无法转成对象,所以如果它们作为参数,就会报错。
-'sn0_q/e EK:s# t[.wx.y&0 console.log(typeof(Object.assign(null)));
N!`8-ap\^ _v+mjDdQ console.log(typeof(Object.assign(underfind)));
t!g9,xG<X 注意:如果非对象参数出现在源对象的位置(即非首参数),那么处理规则有所不同。首先,这些参数都会转成对象,如果无法转成对象,就会跳过。这意味着, 如果undefined和null不在首参数,就不会报错。其他类型的值(即数值、字符串和布尔值)不在首参数,也不会报错。但是,除了字符串会以数组形式,拷贝入目标对象,其他值都不会产生效果。
6#JdQ[IP6 ?8d7/KZO (j%d{y4 Object.assign只拷贝自身属性,不可枚举的属性(enumerable为false)和继承的属性不会被拷贝。
l[2 d{r 4RH'GnLa ;gh#8JkI let obj1 = Object.assign({ dwb: 'zjl' },
u7e g:0Y (X
rrnoz Object.defineProperty({}, 'zmf', {
Qr/8kWa0C Qe!Q
$ enumerable: false,
:\*<EIk( !*0\Yi,6 value: 'zmf'
2 NgEzY5 5pBQ~m3 })
e#YQA uhuwQS=X )
W |]24 3gW4\2|T console.log(obj1);
v5|X=B>&> |5wuYG let obj2 = Object.assign({ dwb: 'zjl' },
M-!eL< aW8Bx\q Object.defineProperty({}, 'zmf', {
Ge+&C RhyX ()}B]? enumerable: true,
AW8" @ j:%~: value: 'zmf'
Gd)@PWK td@F%* })
E'=~<& 4q)eNcs )
DJeP] m:<cLc :. console.log(obj2);
im^G{3z +MKr.k2 对于嵌套的对象,Object.assign的处理方法是替换,而不是添加。
+XU*NAD,! CTt3W>'=+ WKZ9i2hcdf var target = { a: { b: 'c', d: 'e' } }
b0]y$*{j xtKWh`[& var source = { a: { b: 'hello' } }
3e"_R GmN} +( Object.assign(target, source);
7t\W{y 上面代码中,target对象的a属性被source对象的a属性整个替换掉了,而不会得到{ a: { b: 'hello', d: 'e' } }的结果。这通常不是开发者想要的,需要特别小心。有一些函数库提供Object.assign的定制版本(比如Lodash的_.defaultsDeep方法),可以解决深拷贝的问题。
6a PZW i/*&; .O'S@ %] |sHIT<=m vk+TWf n.,\Z(l|0 注意,Object.assign可以用来处理数组,但是会把数组视为对象。
b&p*IyJR |UM':Ec nCEt*~t9VE console.log(Object.assign([1, 2, 3], [4, 5]));
{AqN@i 其中,4覆盖1,5覆盖2,因为它们在数组的同一位置,所以就对应位置覆盖了。
R_.C,mR ? bAt%^pc=y (L8H.|. ' A= x A/%K= H? p0? XR Object.assign方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用。
-ZH]i}$ "P.7FD \TkBV?W var object1 = { a: { b: 1 } };
w<&Nn`V EU
TTeFp var object2 = Object.assign({}, object1);
,d<wEB?\` Sm;&2" object1.a.b = 2;
v-Ggf0RF 1\{0z3P console.log(object2.a.b);
<a2t"rc 2.用途
.@JXV
$Z G9:[W"P lLxKC7b 2.1为对象添加属性
/@lXQM9T 0^*4LM|z M/:kh,3 ^O6P Zm5J} 2.2为对象添加方法
*I(>[m! ])'22sY 0diQfu)Fi tk|Ew!M: 2.3克隆对象
2Y\,[ $z function copyFnc(origin) {
K:c5Yq^ ~zi6wu(3 return Object.assign({}, origin)
;iy]mPd %L=roqz }
u^s{r`/ e!d&
#ofw| var sur = { a: 1, b: 2 };
ah>;wW!6/ iS&fp[Th console.log(copyFnc(sur));
eVjr/nm 上面代码将原始对象拷贝到一个空对象,就得到了原始对象的克隆。
)Uw
QsP cAM1\3HWT" Jt43+] 不过,采用这种方法克隆,只能克隆原始对象自身的值,不能克隆它继承的值。如果想要保持继承链,可以采用下面的代码。
aAh")B2 -A(]",*J *^bqpW2$q function clone(origin) {
kpsus \T ;26a8g( let originProto = Object.getPrototypeOf(origin);
!`hiXDk*2 KV k
36;$ return Object.assign(Object.create(originProto), origin);
^Jcs0c
@\ {xi$'r }
]sE~gro 在JS里子类利用Object.getPrototypeOf去调用父类方法,用来获取对象的原型。
ZMids"Xdf 1"RO)& |y)R lb#d v
AP)(I m]R< :_ 8G`fSac` 2.4 合并多个对象
DlC`GZEtqh y-m<&{q y2gI]A //多个对象合并到某个对象
lZ.x@hDS 1Y6<i8 2Vas`/~u~ const merge = (target, ...sources) => Object.assign(target, ...sources);
*kY\,r&!P //多个对象合并到新对象
2>p K PVH^yWi
n >&6pBtC_ const merge = (...sources) => Object.assign({}, ...sources);
=kH7 e`
Z;}&
, P+ONQN| 3TVp
oB` 2.5为属性指定默认值
p \A ^kX^5 B{$4s8XU 7nM]E_ const DEFAULTS = {
=cI -<0QSn SxMmy
logLevel: 0,
Wd#r-&!6j JJ`RF outputFormat: 'html'
9Jd{HI= $*w]]b$Dn };
q}P< Ejq} n6D9f~8" function processContent(options) {
T n.Cj5 Ks'msSMC let options = Object.assign({}, DEFAULTS, options);
Dx`-Kg_p S.&=>
}
ln4gkm<]t ————————————————
gS{hfDpk,h 版权声明:本文为CSDN博主「想要飞翔的小猪」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
zURxXo/\V 原文链接:
https://blog.csdn.net/dwb123456123456/article/details/83316471