1. 程式人生 > 實用技巧 >Js陣列排序

Js陣列排序

sort()方法是最強大的陣列方法之一。

陣列排序

sort()方法以字母順序對陣列進行排序:

例項

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();            // 對 fruits 中的元素進行排序

反轉陣列

reverse()方法反轉陣列中的元素。

您可以使用它以降序對陣列進行排序:

例項

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();            // 對 fruits 中的元素進行排序
fruits.reverse();         // 反轉元素順序

預設地,sort()函式按照字串順序對值進行排序。

該函式很適合字串("Apple" 會排在 "Banana" 之前)。

不過,如果數字按照字串來排序,則 "25" 大於 "100",因為 "2" 大於 "1"。

正因如此,sort()方法在對數值排序時會產生不正確的結果。

我們通過一個比值函式來修正此問題:

例項

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b}); 

使用相同的技巧對陣列進行降序排序:

例項

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a}); 

比值函式

比較函式的目的是定義另一種排序順序。

比較函式應該返回一個負,零或正值,這取決於引數:

function(a, b){return a-b}

當sort()函式比較兩個值時,會將值傳送到比較函式,並根據所返回的值(負、零或正值)對這些值進行排序。

例項:

當比較 40 和 100 時,sort()方法會呼叫比較函式 function(40,100)。

該函式計算 40-100,然後返回 -60(負值)。

排序函式將把 40 排序為比 100 更低的值。

您可以使用下面的程式碼片段來測試數值和字母排序:

<button onclick="myFunction1()">以字母順序排序</button>
<button onclick="myFunction2()">以數字順序排序</button>

<p id="demo"></p>

<script>
var points = [40, 100, 1, 5, 25, 10];
document.getElementById("demo").innerhtml = points;

function myFunction1() {
        points.sort();
        document.getElementById("demo").innerhtml  = points;
}
function myFunction2() {
        points.sort(function(a, b){return  a - b});
        document.getElementById("demo").innerHTML = points;
}
</script>

以隨機順序排序陣列

例項

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return 0.5 - Math.random()}); 

查詢最高(或最低)的陣列值

JavaScript不提供查詢陣列中最大或最小陣列值的內建函式。

不過,在對陣列進行排序之後,您能夠使用索引來獲得最高或最低值。

升序排序:

例項

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});

// 現在 points[0] 包含最低值
// 而 points[points.length-1] 包含最高值

降序排序:

例項

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a});

// 現在 points[0] 包含最高值
// 而 points[points.length-1] 包含最低值

如果您僅僅需要找到最高或最低值,對整個陣列進行排序是效率極低的方法。

對陣列使用 Math.max()

您可以使用Math.max.apply來查詢陣列中的最高值:

例項

function myArrayMax(arr) {
    return Math.max.apply(null, arr);
}

Math.max.apply([1, 2, 3])等於Math.max(1, 2, 3)。

對陣列使用 Math.min()

您可以使用Math.min.apply來查詢陣列中的最低值:

例項

function myArrayMin(arr) {
    return Math.min.apply(null, arr);
}

Math.min.apply([1, 2, 3])等於Math.min(1, 2, 3)。

廣州品牌設計公司https://www.houdianzi.com PPT模板下載大全https://redbox.wode007.com

我的 Min / MaxJavaScript方法

最快的解決方法是使用“自制”方法。

此函式遍歷陣列,用找到的最高值與每個值進行比較:

例項(查詢 Max)

function myArrayMax(arr) {
    var len = arr.length
    var max = -Infinity;
    while (len--) {
        if (arr[len] > max) {
            max = arr[len];
        }
    }
    return max;
}

此函式遍歷陣列,用找到的最低值與每個值進行比較:

例項(查詢 Min)

function myArrayMin(arr) {
    var len = arr.length
    var min = Infinity;
    while (len--) {
        if (arr[len] < min) {
            min = arr[len];
        }
    }
    return min;
}

排序物件陣列

JavaScript 陣列經常會包含物件:

例項

var cars = [
{type:"Volvo", year:2016},
{type:"Saab", year:2001},
{type:"BMW", year:2010}];

即使物件擁有不同資料型別的屬性,sort() 方法仍可用於對陣列進行排序。

解決方法是通過比較函式來對比屬性值:

例項

cars.sort(function(a, b){return a.year - b.year});

比較字串屬性會稍複雜:

例項

cars.sort(function(a, b){
      var x = a.type.toLowerCase();
      var y = b.type.toLowerCase();
      if (x < y) {return -1;}
      if (x > y) {return 1;}
      return 0;
});