【JavaScript学習記録】sortの落とし穴

1845 ワード
初心者 学習記録 JavaScript JavaScript テキストリンク

　JavaScirptでコードを書いている時に、思った通りの挙動をしてくれないことがあります。
　今回は、JavaScriptで注意したいポイントの１つ、"sort"について取り上げます。

　・.sort( ) ・・・配列の要素を in place でソートします。既定のソート順は昇順で、要素を文字列に変換してから、UTF-16 コード単位の値の並びとして比較します。(MDNより)
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

　ここで注目したいのは、”要素を文字列に変換してから・・・”という表記。
　"文字列に変換してから並べ替えること"で、次のような問題が起こります。

// 数値の並べ替えをする場合
const data = [3, 10, 1, 20, 22, 2, 15]
console.log(data.sort());
// => [ 1, 10, 15, 2, 20, 22, 3 ]

　先頭の１文字目を基準に並べ替えられてしまっています。
　これを解決するには、以下のように比較関数を指定する必要があります。


// 比較関数は a > b ならプラス値、a < b ならマイナス値を返す
data.sort((a, b) => a - b)
// => [ 1, 2, 3, 10, 15, 20, 22 ]

　今回は、以下の記事を参考にさせて頂きました
https://secret-garden.hatenablog.com/entry/2017/10/24/191414

　また一つ勉強になりました