配列操作でよく使うメソッドまとめ03

前回の配列操作でよく使うメソッドまとめ02つづき。
今回も前回までと同じJSONデータを使ってfilterの使い方についてまとめます。
JSONデータの中身は配列操作でよく使うメソッドまとめ01のページ下部に載っています。

各チームのUS出身の選手のみ取り出す

import data from '../EasternConference.json'

let menberArry = data.map(v => v["menbers"])
let countryFilterArry = []
for(let i = 0; i < menberArry.length; i++) {
    countryFilterArry.push(menberArry[i].filter(el => el.from == "US"))
}
console.log(countryFilterArry) // フィルタリングした結果
console.log(menberArry) // フィルタリングする前の配列のまま
return countryFilterArry

まずフィルタリングした結果を格納するための配列を準備しておきます。

let countryFilterArry = []

for文の中でfilter関数を実行しています。filter関数の引数には各チームのメンバーオブジェクトが入ります。
filter関数はfromがUSと一致するメンバーオブジェクトのみを返すので、それを最初に準備しておいたcountryFilterArryに格納して最後にreturnすれば完了です。

ソース内だと以下の部分

for(let i = 0; i < menberArry.length; i++) {
    countryFilterArry.push(menberArry[i].filter(el => el.from == "US"))
}
console.log(countryFilterArry) // フィルタリングした結果
console.log(menberArry) // フィルタリングする前の配列のまま
return countryFilterArry

filterメソッドは破壊的なメソッドではないので元の配列のデータには影響を及ぼしません。

参考資料
Array.prototype.filter()