JavaScript數組的簡單排序
前面的博客分兩章分別講解了數組對象的基本屬性和方法,以及數組迭代方法的使用。今天我們再來講一講數組的排序問題。
1.數組的sort()方法
說到數組的排序,大家可能第一反應是前面學過一個數組排序的方法sort(),但是使用這個方法時要注意,sort()本身時可以傳參數的,如果不傳參數,那我們對數組項進行排序時就會按照ASCII字符順序排序(也可以理解爲字典的排序方式)。比如:
var arr=["a","A",10,1,20,2];
console.log(arr.sort());//[1,10,2,20,"A","a"]
看到上面的代碼時,可能和大家想的不太一樣,但是對照下圖ASCII碼錶不難發現,在表中能看到數字排在大寫字母前面,大寫字母又排在小寫字母前面。所以打印的結果會是代碼所示。
補充一下:其實,sort()方法會調用每個數組項的toString()方法,得到字符串,然後再對字符串進行排序。
2.數組的sort()方法添加參數
上面的操作中我們雖說也對數組進行了排序,但是並沒有得到我們想要的結果。這個時候sort()的參數就起到作用了。當然這個參數是一個函數,我們可以稱之爲比較函數。
比較函數可以接收兩個參數,如果第一參數小於第二個參數,則返回一個負數,相等則返回0,如果第一個參數大於第二個參數則返回正數:
var arr3 = [10, 20, 1, 15, 2, 33, 4];
function shengxu(a, b) {
if (a < b) {
return -1
} else if (a > b) {
return 1
} else {
return 0
}
}
console.log(arr3.sort(shengxu));//[1, 2, 4, 10, 15, 20, 33]
使用上面的方法便可以得到我們想要的升序的排序方式。
如果想要降序排列,只需要修改比較的條件即可:
var arr3 = [10, 20, 1, 15, 2, 33, 4];
function jiangxu(a, b) {
if (a > b) {
return -1
} else if (a < b) {
return 1
} else {
return 0
}
}
console.log(arr3.sort(jiangxu));// [33, 20, 15, 10, 4, 2, 1]
此時,可以將數組項進行降序排列。
3.比較函數的簡化
上面的兩個比較函數可以進行簡化,如下:
var arr3 = [10, 20, 1, 15, 2, 33, 4];
// 升序
function shengxu2(a, b) {
return a - b;
}
// 降序
function jiangxu2(a, b) {
return b - a;
}
console.log(arr3.sort(shengxu2));//[1, 2, 4, 10, 15, 20, 33]
console.log(arr3.sort(jiangxu2));// [33, 20, 15, 10, 4, 2, 1]
注意:使用sort()方法傳入參數比較函數之後也只是可以對數字進行排序,當數組項中出現字符時,會將字符轉化爲數字進行比較,字符不能轉化爲數字,所以數字和字符還是會按照ASCII排序進行比較。但是此時大寫字母會排在小寫字母之後。
var arr = ["a","A",10, 20, 1, 15, 2, 33, 4];
function shengxu(a, b) {
return a - b;
}
console.log(arr.sort(shengxu));//["a", "A", 1, 2, 4, 10, 15, 20, 33]
視頻講解鏈接:
https://www.bilibili.com/video/BV1jC4y1p7oW/