JavaScriptでオブジェクトの配列を特定のプロパティでフィルタリングする方法

map()メソッドと三項演算子（?:）を組み合わせることで、オブジェクトの配列を特定のプロパティに基づいてフィルタリングできます。まず、今回扱う2つのオブジェクト配列を見てみましょう。

let firstCustomerDetails =
[
    {firstName: 'John', amount: 100},
    {firstName: 'David', amount: 50},
    {firstName: 'Bob', amount: 80}
];
let secondCustomerDetails =
[
    {firstName: 'John', amount: 400},
    {firstName: 'David', amount: 70},
    {firstName: 'Bob', amount: 40}
];

今回はamountプロパティを基準に配列を比較し、各位置において金額が大きい方のオブジェクトを新しい配列に格納する処理を作成します。

実装例

let firstCustomerDetails =
[
    {firstName: 'John', amount: 100},
    {firstName: 'David', amount: 50},
    {firstName: 'Bob', amount: 80}
];
let secondCustomerDetails =
[
    {firstName: 'John', amount: 400},
    {firstName: 'David', amount: 70},
    {firstName: 'Bob', amount: 40}
];
var output = firstCustomerDetails.map((key, position) =>
key.amount > secondCustomerDetails[position].amount ? key :
secondCustomerDetails[position]
);
console.log(output);

コードの仕組み

map()メソッドは配列の各要素に対して順番にコールバック関数を実行します。この例では、firstCustomerDetailsの各要素について、同じインデックス位置にあるsecondCustomerDetailsの要素とamountの値を比較しています。三項演算子により、条件がtrueなら1つ目の配列の要素を、falseなら2つ目の配列の要素を返すため、結果として金額が大きい方のオブジェクトだけが集まった新しい配列が生成されます。

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

node fileName.js.

ここでは、ファイル名を「demo83.js」としています。

出力結果

プログラムを実行すると、以下の出力が得られます。

PS C:\Users\Amit\JavaScript-code> node demo83.js
[
    { firstName: 'John', amount: 400 },
    { firstName: 'David', amount: 70 },
    { firstName: 'Bob', amount: 80 }
]

ご覧のとおり、Johnは400、Davidは70というように、各位置でamountの値が大きい方のオブジェクトが出力されました。Bobについては最初の配列の80の方が大きいため、そちらが採用されています。