英数字要素が混在する配列に対して自然ソート アルゴリズムを JavaScript で実装するにはどうすればよいでしょうか?

数字とアルファベットを含む配列要素の自然な並べ替え

数値とアルファベット文字を含む配列要素の順序を決定するのは難しい場合があります。このシナリオを処理するには、要素を真の値に基づいて配置する自然な並べ替えが必要です。

サンプル配列と望ましい結果

次の入力配列を考えてみましょう:

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

希望の並べ替え順序

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

単純な並べ替えアプローチ

提供されているような単純な比較関数は、最初の部分 (2 文字) に従ってのみ要素を並べ替えます。数値部分を無視します:

function compare(a, b) {
  if (a < b) return -1;
  if (a > b) return 1;
  return 0;
}

でのナチュラルソートの実装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;
}

この関数は、各要素をペアの配列に分割します。最初の要素は数値です。 (数値がない場合は無限大)、2 番目の要素は文字列です:

["IL0 Foo"] -> [["0", "IL"], ["Foo", ""]]
["PI0 Bar"] -> [["0", "PI"], ["Bar", ""]]

比較ロジックはペアを 1 つずつ比較し、優先順位を付けます。数値に。数値が等しい場合、localeCompare を使用して文字列が比較されます。

使用例と結果

naturalCompare 関数を使用したサンプル配列の並べ替え:

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"]

以上が英数字要素が混在する配列に対して自然ソート アルゴリズムを JavaScript で実装するにはどうすればよいでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。