JavaScriptのsortで並び替え

一覧画面の操作や、データ整理など、クライアント側で並び替えさせたい場合があります。
sort関数を使って並び替えします。

デフォルトのソート順

const ary = ['な', 'た', 'さ', 'か', 'あ', 5, 44, 3, 22, 1];
ary.sort();
console.log(ary);
// [1, 22, 3, 44, 5, 'あ', 'か', 'さ', 'た', 'な']

※特に条件を指定しない場合、文字列に変換されて並び替えが行われる

参考: Array.prototype.sort()
compareFunction (比較関数) が与えられなかった場合、undefined 以外のすべての配列要素は文字列に変換され、文字列が UTF-16 コード単位順でソートされます。

ただ、大体の場合は「新着順」にしたいなど、データを見て任意に並び替えることが多いかと思います。
任意に並び替えるようソート順を定義する関数を設定します。

ソート順を設定する

// 並び替えするオブジェクト
const obj = {
  post: [
    {
      date: 20220101,
      comment: "い"
    },
    {
      date: 20220102,
      comment: "む"
    },
    {
      date: 20220103,
      comment: "ね"
    }
  ]
}

// dateの降順で、postを出力
obj.post.sort((a, b) => {
  return a.date < b.date ? 1 : -1;
});
console.log(JSON.stringify(obj.post, null, "\t"));
/*
[
	{
		"date": 20220103,
		"comment": "ね"
	},
	{
		"date": 20220102,
		"comment": "む"
	},
	{
		"date": 20220101,
		"comment": "い"
	}
]
*/

並び替えの条件を使いまわしたい場合は、関数にしておきます。

// 関数で宣言
const compare = (a, b) => {
  return a.date < b.date ? 1 : -1;
}
obj.post.sort(compare);
console.log(JSON.stringify(obj.post, null, "\t"));