JavaScriptで既存のプロパティを上書きせずに、あるオブジェクトから別のオブジェクトへプロパティを追加する方法

JavaScriptでは、あるオブジェクトのプロパティを別のオブジェクトにコピーしたい場面がよくあります。しかし、単純に代入してしまうと、すでに存在するプロパティの値が上書きされてしまいます。
そこで役立つのが hasOwnProperty() メソッドです。これを使えば、元のオブジェクトの値を保持したまま、存在しないプロパティだけを安全に追加できます。

サンプルオブジェクト

まず、次の2つのオブジェクトを用意します。

var first = {key1: 100, key2: 40, key3: 70}
var second = {key2: 80, key3: 70, key4: 1000}

この例では、first オブジェクトに second オブジェクトのプロパティを追加します。ただし、first にすでに存在する key2 や key3 は上書きされず、first に存在しない key4 のみが追加されるのがポイントです。

コード例

var first = {key1: 100, key2: 40, key3: 70}
var second = {key2: 80, key3: 70, key4: 1000}
function addPropertiesWithoutOverwritting(first, second) {
   for (var key2 in second) {
      if (second.hasOwnProperty(key2) && !first.hasOwnProperty(key2)) {
         first[key2] = second[key2];
      }
   }
   return first;
}
console.log(addPropertiesWithoutOverwritting(first, second))

仕組みの解説

• for...in ループで second の各プロパティを順番に取り出します。
• second.hasOwnProperty(key) によって、そのキーが second 自身のプロパティであることを確認します（プロトタイプチェーン上の継承プロパティを除外します）。
• !first.hasOwnProperty(key) によって、first に同じキーがまだ存在しないことを確認します。
• 両方の条件を満たす場合のみ、first[key] = second[key] で値をコピーします。

この二重チェックにより、既存のプロパティは一切上書きされることなく、新しいプロパティだけが追加されます。

補足：Object.assign() との違い

Object.assign(first, second) を使うと、second のすべてのプロパティがコピーされ、同名のキーは上書きされてしまいます。「元の値を優先したい」場合には、今回のように hasOwnProperty() でチェックしながら追加する方法が適しています。

プログラムの実行方法

上記のプログラムを実行するには、Node.js環境で次のコマンドを使用します。

node fileName.js

ここでは、ファイル名を demo99.js として保存しています。

出力結果

PS C:\Users\Amit\JavaScript-code> node demo99.js
{ key1: 100, key2: 40, key3: 70, key4: 1000 }

出力結果を見ると、first の key1〜key3 の値は元のまま維持され、second にのみ存在していた key4: 1000 が新しく追加されていることがわかります。このように、hasOwnProperty() を組み合わせることで、安全かつ意図通りにプロパティのマージが可能になります。