JavaScript でオブジェクトを結合する複数の方法

JavaScript はさまざまな方法でオブジェクトを結合します。

1. 方法 1: Object.assign(obj1, obj2, …)

パラメータ 1: obj1 はターゲット オブジェクトです。
パラメータ 2: obj2 はソース オブジェクトです。

注: オブジェクト間では、同じ名前の属性は、後ろにあるオブジェクトの属性値によって上書きされます。

const obj1 = {
    
    
	a: 1,
	b: 2,
}
const obj2 = {
    
    
	b: 3,
	c: 4,
}
const result = Object.assign(obj1, obj2)
console.log(result) // {a: 1, b: 3, c: 4}

2. 方法2：es6の新構文、展開演算子…【3つのポイント】

{...obj1, ...obj2}
注: オブジェクト間では、同じ名前の属性は次のオブジェクトの属性値によって上書きされます

const obj1 = {
    
    
	a: 1,
	b: 2,
}
const obj2 = {
    
    
	b: 3,
	c: 4,
}
const result = {
    
    ...obj1, ...obj2}  // 返回一个新的对象。
console.log(result) // {a: 1, b: 3, c: 4}

// 顺带一提， 数组之间的合并，也可以使用 扩展运算符 .
// 如： [...arr1, ...arr2]

知識の拡大:

スプレッド演算子... [3 点] は、配列間のマージにも使用できます。

違いは、
配列はマージされるだけで、同じ値であっても上書きされないことです。(ここがオブジェクトと異なる点です。)

let arr1 = [1,2,4]

let arr2 = [4,5,6]

let arr3 = [...arr1, ...arr2]

console.log(arr3)  // [1, 2, 4, 4, 5, 6]  

概要: 0.0