Object.assign详解

一、Object.assign是什么?

Object.assign( )方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

二、用法

Object.assign(target, ...sources)

参数:target ------>目标对象

source ------>源对象

返回值:target,即目标对象

三、使用示例

1.目标对象的源对象无重名属性

复制代码
let obj = {a:1,c:20}
let obj1={b:2}
Object.assign(obj,obj1) 
console.log(obj)  //{a: 1, c: 20, b: 2}
console.log(obj1) //{b: 2}

//总结:
//Object.assign(obj,obj1) 
//第一个参数是目标对象,第二个参数以及后面的参数都是源对象 相当于把obj1添加到obj中
//Object.assign()方法 ------>影响到目标对象

2、目标对象和源对象有重名属性

复制代码
let obj = {a:1,c:20}
let obj1={b:2,c:30}
Object.assign(obj,obj1) 
console.log(obj)  //{a: 1, c: 30, b: 2}
console.log(obj1) //{b: 2, c: 30}


//总结:
// 如果目标对象与源对象有同名属性,则后面的属性会覆盖前面的属性

四、与$.extend( )的比较

复制代码
        var target={name:'guxin',age:18}
        var source1={state:'signle',age:22}
        var source2={mood:'happy',age:25}
        var result=Object.assign(target,source1,source2)
        console.log(target,'assign')
        var targetObj={name:'guxin',age:18}
        var sourceObj1={state:'signle',age:22}
        var sourceObj2={mood:'happy',age:25}
        var result=$.extend(targetObj,sourceObj1,sourceObj2)
        console.log(targetObj,'extend')

最终运行结果:

可以看到两者得到的结果是一样的。所以,我认为这两个方法,除了兼容性应该是一样的。

原文链接:Object.assign详解_guxin_duyin的博客-CSDN博客

相关推荐
是翔仔呐7 分钟前
C语言从黑框框到控硬件!51单片机零基础保姆式全系列教程 开篇前言+全书总览
c语言·开发语言·单片机·嵌入式硬件·gitee·51单片机
SuniaWang10 分钟前
《Spring AI + 大模型全栈实战》学习手册系列·专题一:《RAG技术全景解析:从原理到架构设计》
java·javascript·人工智能·spring boot·后端·spring·架构
java1234_小锋10 分钟前
Java高频面试题:Spring是如何解决Bean的循环依赖?
java·开发语言·spring
历程里程碑13 分钟前
43. TCP -2实现英文查中文功能
java·linux·开发语言·c++·udp·c#·排序算法
计算机学姐14 分钟前
基于SpringBoot的流浪动物救助收养系统
vue.js·spring boot·后端·mysql·java-ee·intellij-idea·mybatis
Irene199114 分钟前
通过JavaScript创建新的img元素并指定onload事件,为什么要在赋值src属性之前指定事件处理程序?
javascript
你这个代码我看不懂19 分钟前
Java软引用对象的创建以及对象回收
java·开发语言
qq_4176950521 分钟前
C++中的中介者模式
开发语言·c++·算法
xiangpanf21 分钟前
PHP爬虫框架:Goutte vs Panther
开发语言·c++·vue.js·php
爱丽_22 分钟前
Vue3 响应式系统:`ref`/`reactive`/`watchEffect` 的工作方式与最佳实践
前端·vue.js