【Javascript】オブジェクトの配列でプロパティの値によりソート

スポンサーリンク

プロパティ値でオブジェクト配列をソートする

javascriptで配列をソートするには、sort()メソッドを使います。

sort()メソッドには並び替えのルールを関数として渡すことができます。例えば、countプロパティを持ったオブジェクトのanimals配列をcountの値でソートするコード例は下記です。

let animals = [
  {name: 'dog', count: '2'},
  {name: 'cat', count: '4'},
  {name: 'bird', count: '1'}
]

// countで昇順ソート
animals.sort((a, b) => {
  return a.count - b.count
})

console.log(animals)
// [
//   {name: 'bird', count: '1'},
//   {name: 'dog', count: '2'},
//   {name: 'cat', count: '4'}
// ]

sort()に渡す関数は、数値を返すようにします。負の数を返すとaはbの前、正の数を返すとaはbの後というようにソートされます。

この仕様を使って下のように、あるプロパティがtrueのものだけ先頭に持ってくるというようなこともできます。

let animals = [
  {name: 'dog', flag: false},
  {name: 'cat', flag: true},
  {name: 'bird', flag: false},
  {name: 'snake', flag: true}
]

// flag=trueを先頭にソート
animals.sort((a, b) => {
  if(a.flag){
    return -1
  }else{
    return 1
  }
})

console.log(animals)
// [
//   {name: "snake", flag: true},
//   {name: "cat", flag: true},
//   {name: "dog", flag: false},
//   {name: "bird", flag: false}
// ]

sort()について詳細は下記を参照ください。

Array.prototype.sort() - JavaScript | MDN
sort() は Array のメソッドで、配列の要素をその場 (in-place) でソートし、ソートされた同じ配列の参照を返します。既定のソート順は昇順で、要素を文字列に変換してから、 UTF-16 コード単位の値の並びとして比較します。

未経験、異業種からIT業界に転身。フロントエンジニア。主にJavascript(React.js)をつかったWEBアプリ開発にたずさわる。
お問い合わせ、ご相談など → genpsp10@gmail.com

psp7をフォロー
プログラミング
スポンサーリンク
psp7をフォロー
ハトらぼ

コメント