JavaScript - Sort( ) 到底怎麼用?

Sort( ) 真的把我搞得不要不要的，因為我真的整個搞不懂阿~~
在之前我有寫另一篇的筆記介紹JS array的使用(filter, map, sort, reduce)
裡面就有說明關於 sort()
sort()會將陣列的所有元素進行排序，並回傳原本的陣列，排序會改變，預設的排序順序是根據字串的Unicode編碼位置而定，也可以依照我們想要的方式改變

Unicode編碼排序 - string

可以使用 .charCodeAt(0) 查看

const letters = ['a','c','p','b'];
const newLetters = letters.sort();
console.log(newLetters)
//這邊就會得出依照 Unicode編碼排序的陣列 ["a","b","c","p"]

特別注意的是，大小寫是會造成不一樣的排列順序的!
如果今天是 ['a','A','c','b','D'] 出來會是 ['A','D','a','b','c']

letters.forEach(letter => console.log(letter, letter.charCodeAt(0)))

number

const numbers=[2,5,8,3,4,100];
const newNumbers = numbers.sort();
console.log(newNumbers)

這邊可能一開始會想說應該就是照著數字大小排列了吧
但是出來的結果卻是 [100,2,3,4,5,8]
讓我們使用 forEach 把每個都拿出來看看吧!
要注意的是，如果是數字的話，我們會需要先將它變為字串喔!

numbers.forEach(number => console.log(number, String(number).charCodeAt(0)))

可是我想要從小到大讓 100 在最後面，該怎麼做?

這個時候就需要自己將函式寫進去啦!

首先，我們需要先帶入兩個參數 a,b。這兩個參數會做比較(大於、小於、等於)Three-Way Comparison。
如果:

a<b : 如果 a 小於 b，a 會放在前面
a>b : 如果 a 大於 b，a 會放在後面
a=b : 如果 a 等於 b，a 位置不變

const numbers=[2,5,8,3,4,100];
const newNumbers = numbers.sort( (a,b) => {
 if(a<b){
     return -1
 }else if(a>b){ 
     return 1
 }else{
     return 0
 }
});
console.log(newNumbers)

sort()會去看回傳的是 -1 、 1 還是 0，反著回去看:
回傳 -1 代表: 前面的數字小於後面的數字， a 放 b 前面
回傳 1 代表: 前面的數字大於後面的數字， b 放 a 前面
回傳 0 代表: 前面的數字等於後面的數字，所以不變

如果我想要從大到小的排序呢?

const numbers=[2,5,8,3,4,100];
const newNumbers = numbers.sort( (a,b) => {
 if(a>b){
     return -1
 }else if(a<b){ 
     return 1
 }else{
     return 0
 }
});
console.log(newNumbers)

sort()會去看回傳的是 -1 、 1 還是 0，反著回去看:
回傳 -1 代表: 前面的數字大於後面的數字， a 放 b 前面
回傳 1 代表: 前面的數字小於後面的數字， b 放 a 前面
回傳 0 代表: 前面的數字等於後面的數字，不變

縮減寫法

看到前面落落長，我們是可以縮寫的!
其實回傳是 -1 、 1 或 0 並不是重點，
當我們的參數(a,b)比較
只要是比較後回傳負值，a就放前面。
只要是比較後回傳正值，a就放後面。
只要是比較後回傳0，不變。

所以就有了縮寫寫法:
直接寫出

const numbers=[2,5,8,3,4,100];
const newNumbers = numbers.sort( (a,b) => {
 return a-b
 //a-b 若是負數(代表a<b)，負數會讓a放前面，就會呈現正序
});
console.log(newNumbers)

const numbers=[2,5,8,3,4,100];
const newNumbers = numbers.sort( (a,b) => {
 return b-a
  //b-a 若是負數(代表a>b)，負數會讓a放前面，就會呈現倒序

});
console.log(newNumbers)