首頁 > web前端 > js教程 > 主體

JS中怎麼依照一定規則對陣列元素進行排序

青灯夜游
發布: 2021-08-27 14:37:54
原創
7544 人瀏覽過

在先前的文章中我們介紹了幾種檢測數組元素是否全部符合指定條件的方法,感興趣的可以點擊鏈接進行查閱→《JS數組學習之判斷數組元素是不是都滿足給定條件》。這次我們來聊聊陣列排序,介紹一下在JavaScript中如何對陣列元素進行排序的方法。

今天本文的主要內容是:將陣列元素依照一定規則進行排序。廢話不多說,以下就給大家就是3種陣列元素排序方法。

方法1:利用for迴圈

說到利用for迴圈進行陣列排序,就想到了冒泡排序,下面看看實作程式碼:

//每轮依次比较相邻两个数的大小,后面比前面小则交换
var b=0//设置用来调换位置的值
var a=[1,9,33,2,5,34,23,98,14]//冒泡排序
for(var i=0;i<a.length;i++){
	for(var j=0;j<a.length;j++){
		if(a[j]>a[j+1]){
			b=a[j]
			a[j]=a[j+1]
			a[j+1]=b
		}
	}
}
console.log(a)
登入後複製

輸出結果:

JS中怎麼依照一定規則對陣列元素進行排序

上面程式碼是從小到大排序,如果想要從大到小排序,可以將if語句的判斷加修改一下:

if(a[j]>a[j+1]){
...
}
登入後複製

JS中怎麼依照一定規則對陣列元素進行排序

方法2:使用sort() 方法

sort() 方法能夠依照一定條件對陣列元素進行排序。

語法:array.sort([函數])

sort() 方法兩種情況:

  • 當方法的參數為空時,則按字母順序對數組中的元素進行從小到大排序。

所謂的字母順序,實際上是根據字母在字元編碼表中的順序進行排列的,每個字元在字元表中都有一個唯一的編號。

var a=[&#39;e&#39;,&#39;a&#39;,&#39;f&#39;,&#39;b&#39;,&#39;c&#39;,&#39;h&#39;,&#39;g&#39;,&#39;z&#39;,&#39;i&#39;]
a.sort();  //按字母顺序对元素进行排序
console.log(a);
登入後複製

輸出結果:

JS中怎麼依照一定規則對陣列元素進行排序

如果元素不是字串,則 sort() 方法試圖將陣列元素都轉換成字串,以便進行比較。需要注意當數字是按字母順序排列時"40"將排在"5"前面。

var a=[1,2,40,4,5,50,6,7,8]
a.sort();  //按字母顺序对元素进行排序
console.log(a);
登入後複製

輸出結果:

JS中怎麼依照一定規則對陣列元素進行排序

此時就需要透過一個函數作為參數來調用,也就是下面的第二種情況:

  • 當參數為一個函數時,將依函數指定的規則排序數組元素。

var a=[1,2,40,4,5,50,6,7,8]
a.sort(function(a,b){
     return a-b;//从小到大排序
     //return b-a;//从大到小排序
});
console.log(a);
登入後複製

輸出結果:

JS中怎麼依照一定規則對陣列元素進行排序

當陣列元素的前綴為數字而後綴為字串時,如果希望這些元素能依數字大小排序,此時需對匿名函數中的參數作一些變通處理。

var a=[&#39;345px&#39;,&#39;23px&#39;,&#39;10px&#39;,&#39;1000px&#39;];
a.sort(function(a,b){
     return parseInt(a)-parseInt(b);;//从小到大排序
     //return parseInt(b)-parseInt(a);//从大到小排序
});
console.log(a);
登入後複製

輸出結果:

JS中怎麼依照一定規則對陣列元素進行排序

方法3:利用reverse() 方法

如何不想將陣列元素從小到大(或從大到小)進行排序,而是想倒序排序呢?那麼可以使用reverse() 方法。

reverse() 方法能夠顛倒陣列元素的排列順序,此方法不需要參數,直接 陣列物件.reverse()即可。

var a=[&#39;345px&#39;,&#39;23px&#39;,&#39;10px&#39;,&#39;1000px&#39;];
a.reverse();
console.log(a);
登入後複製

輸出結果:

JS中怎麼依照一定規則對陣列元素進行排序

說明:

sort()和reverse() 方法都是在原始數組基礎上進行操作,而不是創建新的數組;因此會改變原始數組。

好了,就說到這裡了,有需要的可以看:javascript影片教學

#

以上是JS中怎麼依照一定規則對陣列元素進行排序的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板