Object.assign 合并多个对象的属性，如果是对象有同名属性，则后面对象的属性值覆盖前面的。

Posted 最好的安排

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Object.assign 合并多个对象的属性，如果是对象有同名属性，则后面对象的属性值覆盖前面的。相关的知识，希望对你有一定的参考价值。

 

 

 

 

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


<script>
	const target = { a: 1, b: 2 };
	const source = { b: 4, c: 5 };

	const returnedTarget = Object.assign(target, source);

	console.log(target);
	// expected output: Object { a: 1, b: 4, c: 5 }

	console.log(returnedTarget);
	// expected output: Object { a: 1, b: 4, c: 5 }
</script>




语法
Object.assign(target, ...sources)

参数

target   目标对象。

sources    源对象。

返回值     目标对象。

描述
如果目标对象中的属性具有相同的键，则属性将被源对象中的属性覆盖。后面的源对象的属性将类似地覆盖前面的源对象的属性。

Object.assign 方法只会拷贝源对象自身的并且可枚举的属性到目标对象。该方法使用源对象的[[Get]]和目标对象的[[Set]]，所以它会调用相关 getter 和 setter。因此，它分配属性，而不仅仅是复制或定义新的属性。如果合并源包含getter，这可能使其不适合将新属性合并到原型中。为了将属性定义（包括其可枚举性）复制到原型，应使用Object.getOwnPropertyDescriptor()和Object.defineProperty() 。

String类型和 Symbol 类型的属性都会被拷贝。

在出现错误的情况下，例如，如果属性不可写，会引发TypeError，如果在引发错误之前添加了任何属性，则可以更改target对象。

注意，Object.assign 不会在那些source对象值为 null 或 undefined 的时候抛出错误。


引用：https://developer.mozilla.org/zh-CN/docs/Web/javascript/Reference/Global_Objects/Object/assign

　　

 

 

 

 

这里必须引用jQuery.js库才可以

$.extend()合并多个对象，后面对象属性覆盖前面对象属性
/*$.extend( target [, object1 ] [, objectN ] )
$.extend( [deep ], target, object1 [, objectN ] )

deep	可选。 Boolean类型 指示是否深度合并对象，默认为false。如果该值为true，且多个对象的某个同名属性也都是对象，则该"属性对象"的属性也将进行合并。
target	Object类型 目标对象，其他对象的成员属性将被附加到该对象上。
object1	可选。 Object类型 第一个被合并的对象。
objectN	可选。 Object类型 第N个被合并的对象。*/

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
 
<div id="log"></div>
<script>
$(function () { 
	var object1 = {
		apple: 0,
		banana: {weight: 52, price: 100},
		cherry: 97
	};
	var object2 = {
		banana: {price: 200},
		durian: 100
	};
	/* object2 合并到 object1 中 */
	$.extend(object1, object2);
	var printObj = typeof JSON != "undefined" ? JSON.stringify : function(obj) {
		var arr = [];
		$.each(obj, function(key, val) {
			var next = key + ": ";
			next += $.isPlainObject(val) ? printObj(val) : val;
			arr.push( next );
		});
		return "{ " +  arr.join(", ") + " }";
	};
	$("#log").append( printObj(object1) );
})
</script>
 
</body>
</html>

　　

以上是关于Object.assign 合并多个对象的属性，如果是对象有同名属性，则后面对象的属性值覆盖前面的。的主要内容，如果未能解决你的问题，请参考以下文章

JS-使用 Object.assign合并多个Object对象

js 合并多个对象 Object.assign

es6新语法Object.assign()

object.assign和直接赋值的区别

Object.assign使用的方法

js_Object.assign(对象的合并)