如何按自然順序對包含字串和數字的元素（例如'img12.png”和'img10.png”）進行排序？

使用字串和數字組成的陣列元素的自然排序

在某些情況下，我們會遇到包含遵循特定格式的元素的數組，例如作為嵌入數字的字串。以邏輯順序對此類數組進行排序（稱為“自然排序”）是一項挑戰。

挑戰

考慮一個如下數組：

["IL0 Foo", "PI0 Bar", "IL10 Baz", "IL3 Bob says hello"]

達到想要的效果排序：

["IL0 Foo", "IL3 Bob says hello", "IL10 Baz", "PI0 Bar"]

解決方案

自然排序需要比較函數來考慮每個元素中的數字和文字部分。這是 JavaScript 實作：

function naturalCompare(a, b) {
    var ax = [], bx = [];

    a.replace(/(\d+)|(\D+)/g, function(_, , ) { ax.push([ || Infinity,  || ""]) });
    b.replace(/(\d+)|(\D+)/g, function(_, , ) { bx.push([ || Infinity,  || ""]) });

    while(ax.length && bx.length) {
        var an = ax.shift();
        var bn = bx.shift();
        var nn = (an[0] - bn[0]) || an[1].localeCompare(bn[1]);
        if(nn) return nn;
    }

    return ax.length - bx.length;
}

說明

• 此函數以子陣列陣列取代任何數字或非數字。
• 每個子數組的元素代表對應的數字和文字元件substring。
• 函數迭代兩個字串的子數組，先比較數值，然後比較文字值。
• 如果數字比較沒有結果，則該函數對文字元件執行字典順序比較.
• 每個字串的剩餘子數組的長度之間的分佈決定了自然排序。

範例

test = [
    "img12.png",
    "img10.png",
    "img2.png",
    "img1.png",
    "img101.png",
    "img101a.png",
    "abc10.jpg",
    "abc10",
    "abc2.jpg",
    "20.jpg",
    "20",
    "abc",
    "abc2",
    ""
];

test.sort(naturalCompare)

排序後的陣列將是：

["", "20", "20.jpg", "abc", "abc2", "abc2.jpg", "abc10", "abc10.jpg", "img1.png", "img2.png", "img10.png", "img12.png", "img101.png", "img101a.png"]

以上是如何按自然順序對包含字串和數字的元素（例如'img12.png”和'img10.png”）進行排序？的詳細內容。更多資訊請關注PHP中文網其他相關文章！