JavaScript のオブジェクトは、キーと値のペアのグループとして記述されます。開発者は、2 つのオブジェクトのプロパティを新しいオブジェクトに結合する必要がある場合があります。このプロセスはマージと呼ばれます。オブジェクトをマージするために、JavaScript は「 Object.assign() 」メソッドまたは「 スプレッド演算子 」。
この投稿では、2 つの JavaScript オブジェクトのプロパティを動的にマージする方法について説明します。
2 つの JavaScript オブジェクトのプロパティを動的にマージする方法は?
次のメソッドを使用して、2 つの JavaScript オブジェクトのプロパティを動的にマージします。
方法 1: Object.assign() メソッドを使用して動的に 2 つの JavaScript オブジェクトのプロパティをマージ/結合する
使用 ' Object.assign() 」メソッドを使用して、2 つの JavaScript オブジェクトのプロパティを動的に結合します。このメソッドは、列挙可能なすべてのプロパティを 1 つ以上のソース オブジェクトからターゲット オブジェクトにコピーすることにより、元のオブジェクトの整合性を維持します。両方のオブジェクトに同じ属性が存在する場合、2 番目のオブジェクトの値が最初の値を置き換えます。このメソッドは列挙可能なプロパティのみをコピーするため、オブジェクトのプロトタイプから継承されたプロパティはコピーしないことに注意してください。
構文
2 つの JavaScript オブジェクトをマージするには、次の構文に従います。
targetObject = Object.assign ( obj1、obj2、... ) ;例
オブジェクトを作成する」 情報 」:
情報 = {名前: 「ジェニー」 、
年: 24 、
ロールノ: 15
} ;
2 番目のオブジェクトを作成します。 活動 」に次の鍵ペアを使用します。
var アクティビティ = {ゲーム: 'クリケット' 、
エクササイズ: 「ヨガ」
} ;
「に電話する」 Object.assign() 」のプロパティをマージするメソッド 情報 ' と ' 活動 」という名前の新しいオブジェクトで 学生 」:
var 学生 = Object.assign ( 情報、活動 ) ;オブジェクトのプロパティを出力する “ 学生 」を使用して console.log() ' 方法:
console.log ( 学生 ) ;出力は、オブジェクトのプロパティ「 情報 ' と ' 活動 ” が新しいオブジェクトに正常にマージされました “ 学生 」:
方法 2: Spread 演算子を使用して動的に 2 つの JavaScript オブジェクトのプロパティをマージ/結合する
2 つの JavaScript オブジェクトをマージする別の方法があります。 スプレッド演算子 」。これは、オブジェクトからすべての属性をコピーしてオブジェクトをマージするために一般的に使用されるアプローチです。 2 つのオブジェクトに同じ名前のプロパティがある場合、右側のオブジェクト プロパティが前のものを置き換えます。
構文
次の構文は、Spread オペレーターを使用して 2 つの JavaScript オブジェクトのプロパティをマージするために使用されます。
targetObject = Object.assign ( ...obj1、...obj2、.... ) ;例
新しいオブジェクトを作成する ' 学生 ” オブジェクトのプロパティをマージします “ 情報 ' と ' 活動 ”スプレッド演算子を使用する学生” … 」:
学生だった = {...情報、...活動
} ;
出力
JavaScript でのオブジェクトのマージに関連するすべての必要な情報を提供しました。
結論
JavaScript でオブジェクトのプロパティをマージ/結合するには、「 Object.assign() 」メソッドまたは「 スプレッド演算子 」。スプレッド演算子は、JavaScript オブジェクトのプロパティをマージするために最も一般的に使用される方法です。両方のオブジェクトに同じ属性が存在する場合、2 番目のオブジェクトの値が最初の値を置き換えます。この投稿では、2 つの JavaScript オブジェクトのプロパティを動的にマージ/結合する方法について説明しました。