JavaScriptでundefinedの値を無視して2つのオブジェクトをマージする方法

ここでは、次のような2つのオブジェクトAとBがあると仮定します。

const A = { activity: 'purchased', count: undefined, time: '09:05:33' };
const B = { activity: 'purchased', count: '51', time: undefined };

求められているのは、これら2つのオブジェクトをマージするJavaScript関数を作成することです。ただし重要な条件として、あるキーにtruthy（真と評価される）な値が存在する場合は、falsy（偽と評価される）な値によって上書きされないようにする必要があります。

なぜスプレッド演算子だけでは不十分なのか

単純にスプレッド演算子（...）を使ってマージすると、後ろのオブジェクトの値が常に優先されるため、値がtruthyかfalsyかは考慮されません。つまり、{ ...A, ...B }のように記述すると、B側のundefinedがA側の有効な値を上書きしてしまう可能性があります。

そこで、各キーを反復処理しながら値を判定するアプローチを採用します。

実装例

以下がコード例です。

const A = { activity: 'purchased', count: undefined, time: '09:05:33' };
const B = { activity: 'purchased', count: '51', time: undefined };
const mergeObject = (A, B) => {
   let res = {};
   Object.keys({...A, ...B}).map(key => {
      res[key] = B[key] || A[key];
   });
   return res;
};
console.log(mergeObject(A, B));

コードのポイント

• Object.keys({...A, ...B})により、両方のオブジェクトに含まれるすべてのキーを取得します。
• B[key] || A[key]という論理OR演算子の評価により、Bの値がfalsy（undefined、null、空文字など）の場合は自動的にAの値が採用されます。

出力結果

コンソールには以下の出力が表示されます。

{ activity: 'purchased', count: '51', time: '09:05:33' }

このように、countはBの有効な値'51'が採用され、timeはBのundefinedが無視されてAの'09:05:33'が使われていることがわかります。