とあるWeb屋の備忘録

とあるWeb屋の備忘録。たまに雑記。

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

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

各チームの選手を年齢順にソート

import data from '../EasternConference.json'
let menberArry = data.map(v => v["menbers"])
for(let i =0; i < menberArry.length; i++) {
  menberArry[i].sort((a, b) => a.age - b.age)
  console.log(menberArry[i])
}

for文の中でsort関数を実行しています。sort関数は引数に比較関数を渡してその結果に応じて昇順/降順が決まります。
ソース内だと以下の部分

sort((a, b) => a.age - b.age)

これは単純にオブジェクトのキーを指定して、引き算をしているだけです。この引き算の戻り値が正か負かを気にすれば良いだけです。
戻り値が負なら昇順、正なら降順になります。
今回は昇順で良いのでこの順番ですが、降順にしたければ以下のようにすれば良いです。

sort((a, b) => b.age - a.age)

名前の長さ順なら以下

sort((a, b) => a.name.length - b.name.length)

ちなみにsortは破壊的メソッドになるため元データの並び順が変わります。
元データを壊さずソートした配列を使いたい場合は以下のようにsliceを使って元のデータのコピーをソートすれば良いです。
sliceで配列をコピーするのでコピー用の配列sliceArryを作ってそれにpushしていきます。

let menberArry = data.map(v => v["menbers"])
let sliceArry = []
for(let i =0; i < menberArry.length; i++) {
  sliceArry.push(menberArry[i].slice().sort((a, b) => a.name.length - b.name.length))
}

これでmenberArryを壊すことなくsortした結果をsliceArryに格納することができました。
また、sliceを使う方法はシャローコピーになるためsliceArryのデータを変更すると元データも影響を 受けます。
それを避けたい場合はディープコピーして元データに影響がないようにする必要がありますので、シャローコピーされていることを頭の片隅に置いておくと良いかもしれません。

参考資料
Array.prototype.sort()