【JavaScript】数値配列を昇順・降順にソートし、入れ替える方法

数値配列内の値を昇順・降順にソートし、入れ替えたい。

本記事ではこのような悩みを解決。

実装方法について解説します。

昇順に並び替え

var array = [5, 20, 1, 4];
array.sort(function (a, b) {
  // a-bの差が正(+)のとき、aをbの後ろに並べ替え
  // a-bの差が負(-)のとき、aをbの前に並べ替え
  return a - b;
});
// 降順出力
// [1, 4, 5, 20]
console.log(array);

昇順に数値配列を並び替えるサンプルコードです。

並び替えにはsortメソッドを用います。

sortメソッド内でコールバック関数【a(配列内の一つ目の数値)】-【b(配列内の二つ目の数値)】を定義。

【a(配列内の一つ目の数値)】ー【b(配列内の二つ目の数値)】が正(+)の時aをbの後ろに並べ替え
【a(配列内の一つ目の数値)】ー【b(配列内の二つ目の数値)】が負(-)の時aをbの前に並べ替え

上記の比較演算結果を返す事で昇順に数値配列を並び変える事ができます。

降順に並び替え

var array = [5, 20, 1, 4];
array.sort(function (a, b) {
  // b-aの差が正(+)のとき、bをaの後ろに並べ替え
  // b-aの差が負(-)のとき、bをaの前に並べ替え
  return b - a;
});
// 降順出力
// [20, 5, 4, 1]
console.log(array);

前章とは逆に降順に並び替えるサンプルコードです。

コールバック関数をa-bからb-aに変更するだけです。

まとめ

上記の実装方法でJavaScriptの数値配列を昇順・降順に並び替える事ができます。

webサイトに簡単なソート機能(ランキングなど)を付けたい場合、役立ちます。

以上で解説を終わります。

Ads

関連記事

JavaScript プログラミング

【簡単】スマホでよくある横スライドメニューを実装する方法【jQuery・CSS使用】

2022.02.14
250
JavaScript

Javascriptでvideoタグのオプションを設定

更新日:2019.11.28
92
JavaScript プログラミング

jQueryで画像読み込み完了後にイベントを実行する方法

2022.04.26
106
JavaScript プログラミング

【簡単】slickスライダーでデバイス事にオプションを切り替えよう【レスポンシブ設定を追加】

2022.04.07
68