Object.assign()是es6中新增的合并对象的方法,该方法接受一个目标对象和一个或者多个源对象作为参数,然后将每个源对象中可枚举(Objetc.propertyIsEnumerable()
返回true)和自有(Object.hasOwnproperty()
返回true)属性复制到目标对象。
案例1:简单复制
let dest,src,result;
dest={};
src={id:'src'}
result=Object.assign(dest,src);
console.log(dest===result);//true
console.log(dest!==src);//true
console.log(result);//{id:src}
console.log(dest);//{id:src}
案例2:多个源对象
//多个源对象
let dest, src, result;
dest = {}
result = Object.assign(dest, {
a: 'foo'
}, {
b: 'bar'
})
console.log(result); //{ a: 'foo', b: 'bar' }
案例3.获取函数与设置函数
let dest, src, result;
// 获取函数与设置函数
dest = {
set a(val) {
console.log(`我被设置为了${val}`);
}
}
src = {
get a() {
console.log('我是用来获取a的值的');
return 'foo'
}
}
Object.assign(dest, src)
// console.log(dest.a); //我是用来获取a的值的
dest.a = 123
console.log(dest.a); //我被设置为了123
// 注意:因为这里的设置函数不执行赋值操作,所以实际上并没有把值转移过来
Object.assign()
实际上对每个源对象执行的是浅复制,如果多个源对象都有相同的属性,则使用最后一个复制的值,但是要注意:不能在两个对象之间转移获取函数和设置函数。
案例4: Object.assign会覆盖重复的属性
let dest, src, result;
// 覆盖属性
dest = {
id: '111'
}
result = Object.assign(dest, {
id: '222',
age: 18
}, {
id: '333',
name: '你好啊'
})
console.log(result); //{ id: '333', age: 18, name: '你好啊' }
案例5:对象引用
浅复制意味着只会复制对象的引用
let dest, src, result;
dest = {}
src = {
target: {}
}
result = Object.assign(dest, src)
console.log(result.target === src.target);//true
result.target.name = '你好啊';
console.log(src.target.name);//你好啊
案例6:错误处理
let dest, src, result;
// 如果复制期间出错,则操作会终止并退出,同时抛出错误,Object.assign没有回滚之前赋值的概念,因此它是一个尽力而为,可能只会完成部分复制的方法
dest = {}
src = {
a: '1',
get b() {
throw new Error()
},
c: '2'
}
try {
Object.assign(dest, src)
} catch (e) {}
console.log(dest); //{ a: '1' }Object.assign没办法回滚已经完成的修改,因此在抛出错误之前,目标对象上已经完成的复制会继续存在
原文参考:
javascript高级程序设计 第四版
,在这里写这些笔记只是为了方便自己回过头来复习
网友评论