美文网首页
Object.assign()合并对象

Object.assign()合并对象

作者: 5cc9c8608284 | 来源:发表于2022-03-22 09:50 被阅读0次

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高级程序设计 第四版,在这里写这些笔记只是为了方便自己回过头来复习

相关文章

  • ES6 - 对象

    对象合并:Object.assign()克隆对象:Object.assign({}, origin) 属性的遍历 ...

  • 对象的方法: Object.assign()、Object.ke

    1、Object.assign()方法 对象的合并。例子: object = Object.assign( {...

  • Object.assign()的使用

    一、Object.assign()对象的拷贝 二、Object.assign()对象的深拷贝 3、对象的合并 4、...

  • Object.assign()

    Object.assign() 浅拷贝 Object.assign 方法用于对象的合并,将源对象(source)的...

  • JavaScript对象深浅拷贝

    首先对象属性和方法的简写方法。 Object.assign()Object.assign方法用于对象的合并。当对象...

  • ES6 Object.assign()的用法

    ES6的Object.assign()的基本用法 Object.assign方法用于对象的合并,将源对象(sour...

  • 【Javascript】ES新用法

    1. ES6之Object.assign() 用于合并/复制对象的属性:Object.assign(target,...

  • es6

    合并对象 Object.assign(a,c) 合并对象到a ,返回一个对象(b)。 a和b 是指向同一个对象...

  • 2个对象的合并&&深拷贝

    Object.assign(对象,对象2) 可以将两个对象合并到一起

  • es6...扩展操作符

    数组合并 对象合并 Object.assign的详细用法参考资料:https://developer.mozill...

网友评论

      本文标题:Object.assign()合并对象

      本文链接:https://www.haomeiwen.com/subject/kqfadrtx.html