Rumah > hujung hadapan web > tutorial js > Bagaimanakah anda mengisih tatasusunan dengan elemen yang mengandungi kedua-dua rentetan dan nombor dalam susunan semula jadi, seperti 'img12.png' dan 'img10.png'?

Bagaimanakah anda mengisih tatasusunan dengan elemen yang mengandungi kedua-dua rentetan dan nombor dalam susunan semula jadi, seperti 'img12.png' dan 'img10.png'?

Mary-Kate Olsen
Lepaskan: 2024-12-16 15:53:17
asal
949 orang telah melayarinya

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

Isih Semulajadi Elemen Tatasusunan dengan Komponen Rentetan dan Angka

Dalam sesetengah kes, kami menghadapi tatasusunan yang mengandungi elemen yang mengikut format tertentu, seperti sebagai rentetan dengan nombor terbenam. Mengisih tatasusunan sedemikian dalam susunan logik, yang dikenali sebagai "isihan semula jadi", memberikan cabaran.

Cabaran

Pertimbangkan tatasusunan seperti:

["IL0 Foo", "PI0 Bar", "IL10 Baz", "IL3 Bob says hello"]
Salin selepas log masuk

Untuk mencapai yang diidamkan pengisihan:

["IL0 Foo", "IL3 Bob says hello", "IL10 Baz", "PI0 Bar"]
Salin selepas log masuk

Penyelesaian

Isihan semulajadi memerlukan fungsi perbandingan yang mempertimbangkan kedua-dua komponen angka dan teks dalam setiap elemen. Berikut ialah pelaksanaan 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;
}
Salin selepas log masuk

Penjelasan

  • Fungsi menggantikan mana-mana digit atau bukan digit dengan tatasusunan subarray.
  • Elemen setiap subarray mewakili komponen numerik dan tekstual yang sepadan subrentetan.
  • Fungsi ini berulang melalui subarray kedua-dua rentetan, membandingkan nilai berangka dahulu dan kemudian nilai teks.
  • Jika perbandingan berangka tidak konklusif, fungsi melakukan perbandingan leksikografi komponen tekstual .
  • Habaran antara panjang subbarray yang tinggal untuk setiap rentetan menentukan sifat semula jadi memesan.

Contoh

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)
Salin selepas log masuk

Susun atur yang diisih ialah:

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

Atas ialah kandungan terperinci Bagaimanakah anda mengisih tatasusunan dengan elemen yang mengandungi kedua-dua rentetan dan nombor dalam susunan semula jadi, seperti 'img12.png' dan 'img10.png'?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan