ホームページ >ウェブフロントエンド >jsチュートリアル >「img12.png」と「img10.png」のように、文字列と数値の両方を含む要素を含む配列を自然な順序で並べ替えるにはどうすればよいですか?

「img12.png」と「img10.png」のように、文字列と数値の両方を含む要素を含む配列を自然な順序で並べ替えるにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-16 15:53:17951ブラウズ

How do you sort an array with elements containing both strings and numbers in a natural order, like

文字列コンポーネントと数値コンポーネントを含む配列要素の自然な並べ替え

場合によっては、次のような特定の形式に従う要素を含む配列が発生することがあります。数値が埋め込まれた文字列として。このような配列を論理的な順序で並べ替える (「自然な並べ替え」と呼ばれる) ことには、課題が伴います。

課題

次のような配列を考えてみましょう。

["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 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。