Rumah > hujung hadapan web > tutorial js > Perkongsian 4 kaedah pemformatan tempat seribu digital dilaksanakan dalam kemahiran JS_javascript

Perkongsian 4 kaedah pemformatan tempat seribu digital dilaksanakan dalam kemahiran JS_javascript

WBOY
Lepaskan: 2016-05-16 16:11:49
asal
1066 orang telah melayarinya

Bentuk nombor yang dipanggil ribuan, iaitu bermula dari satu digit, tambahkan koma di antara setiap tiga digit. Contohnya "10,000". Sebagai tindak balas kepada keperluan ini, saya pada mulanya menulis fungsi seperti ini:

Salin kod Kod adalah seperti berikut:

//Kaedah 1
fungsi kepada Ribuan(bilangan) {
hasil var = [ ], pembilang = 0;
num = (num || 0).toString().split('');
untuk (var i = num.length - 1; i >= 0; i--) {
kaunter ;
         result.unshift(bilangan [i]);
Jika (!(counter % 3) && i != 0) { result.unshift(','); }
Kembalikan hasil.join('');
}

Proses pelaksanaan kaedah satu ialah menukar nombor kepada rentetan, memecahkannya kepada tatasusunan, dan kemudian memasukkan elemen dalam tatasusunan ke dalam permulaan tatasusunan baharu (hasil) satu demi satu bermula dari penghujung. Setiap kali elemen dimasukkan, pembilang dikira sekali (tambah 1 Apabila pembilang ialah gandaan 3, koma disisipkan, tetapi ambil perhatian bahawa tiada koma diperlukan pada permulaan (apabila i ialah 0). Akhirnya, hasilnya diperoleh dengan memanggil kaedah gabungan tatasusunan baharu.
Kaedah 1 agak jelas dan mudah difahami, dan telah digunakan dalam projek untuk beberapa lama. Tetapi intuisi saya memberitahu saya bahawa prestasinya tidak baik.

Kaedah 2 - versi rentetan kaedah 1


Salin kod Kod adalah seperti berikut:
//Kaedah 2
fungsi kepada Ribuan(bilangan) {
hasil var = '', pembilang = 0;
num = (num || 0).toString();
untuk (var i = num.length - 1; i >= 0; i--) {
kaunter ;
hasil = num.charAt(i) hasil;
Jika (!(counter % 3) && i != 0) { result = ',' result; }
Pulangan hasil;
}


Kaedah 2 ialah versi kaedah 1 yang dipertingkatkan. Ia tidak memecahkan rentetan kepada tatasusunan dan sentiasa beroperasi pada rentetan.

Kaedah 3 - Gelung untuk memadankan tiga nombor terakhir


//Kaedah 3
fungsi kepada Ribuan(bilangan) {
var num = (num || 0).toString(), re = /d{3}$/, result = '';
Manakala ( ujian semula(bilangan) ) {
          keputusan = RegExp.lastMatch keputusan;
Jika (bilangan != RegExp.lastMatch) {
              hasil = ',' hasil;
               num = RegExp.leftContext;
         } lain {
             nombor = '';
             rehat;
}
}
Jika (bilangan) { hasil = bilangan hasil; Pulangan hasil;
}



Kaedah 3 ialah algoritma yang sama sekali berbeza. Ia bergelung melalui ungkapan biasa untuk memadankan tiga nombor pada penghujung Setiap kali ia sepadan, koma dan kandungan yang dipadankan dimasukkan ke dalam permulaan rentetan hasil, dan kemudian padanan. sasaran (num) Berikan nilai kepada kandungan yang belum dipadankan (RegExp.leftContext). Juga, ambil perhatian:
1. Jika bilangan digit ialah gandaan 3, kandungan yang dipadankan terakhir mestilah tiga digit, tetapi tidak perlu menambah koma sebelum tiga digit pertama; 2. Jika bilangan digit dalam nombor itu bukan gandaan 3, maka pasti akan ada 1 atau 2 nombor yang tinggal dalam pembolehubah num di hujung Selepas gelung, nombor yang tinggal perlu dimasukkan ke dalam permulaan rentetan hasil.

Walaupun kaedah tiga mengurangkan bilangan gelung (memproses tiga aksara dalam satu gelung), ia meningkatkan penggunaan pada tahap tertentu disebabkan penggunaan ungkapan biasa.


Kaedah 4 - Versi rentetan kaedah 3


Salin kod

Kod adalah seperti berikut:

//Kaedah 4
fungsi kepada Ribuan(bilangan) {
var num = (num || 0).toString(), result = '';
manakala (bilangan panjang > 3) {
          hasil = ',' num.slice(-3) hasil;
​​ num = num.slice(0, num.length - 3);
}
Jika (bilangan) { hasil = bilangan hasil; Pulangan hasil;
}

Malah, fungsi memintas tiga aksara terakhir boleh dicapai melalui kaedah slice, substr atau substring jenis rentetan. Dengan cara ini anda mengelak daripada menggunakan ungkapan biasa.

Kaedah Lima - Kaedah Pengumpulan dan Penggabungan


Salin kod Kod adalah seperti berikut:
//Kaedah 5
fungsi kepada Ribuan(bilangan) {
var num = (num || 0).toString(), temp = num.length % 3;
suis (suhu) {
kes 1:
              nombor = '00' nombor;
             rehat;
kes 2:
              nombor = '0' nombor;
             rehat;
}
Kembalikan num.match(/d{3}/g).join(',').replace(/^0 /, '');
}

Mula-mula melengkapkan bilangan digit kepada gandaan 3, gunakan ungkapan biasa untuk memotongnya kepada kumpulan tiga digit, kemudian tambah koma melalui kaedah cantum, dan akhirnya alih keluar 0 yang dilengkapkan.

Kaedah Enam - Kaedah Orang Malas


Salin kod Kod adalah seperti berikut:
//Kaedah 6
fungsi kepada Ribuan(bilangan) {
Kembalikan (bilangan || 0).toString().replace(/(d)(?=(?:d{3}) $)/g, '$1,');
}

Saya sentiasa merasakan bahawa pemformatan ini boleh dilakukan dengan menggantikan ungkapan biasa, tetapi ia memerlukan penggunaan penegasan dan kaedah penulisan lain Malangnya, saya tidak biasa dengan bahagian ini. Selepas beberapa carian di Google, saya benar-benar menemui ungkapan biasa seperti ini. Ini mungkin merupakan pelaksanaan kod yang paling singkat.
Keputusan ujian

数字 执行5000次消耗的时间(ms)
方法一 方法二 方法三 方法四 方法五 方法六
1 4 1 3 1 14 2
10 14 1 3 0 7 2
100 12 1 2 4 5 3
1000 13 2 3 2 9 5
10000 21 4 3 1 6 3
100000 21 3 2 1 5 6
Perbandingan kukuh antara Kaedah 1 dan Kaedah 2 menunjukkan bahawa kecekapan operasi rentetan adalah lebih tinggi daripada operasi tatasusunan, keputusan ujian Kaedah 6 memberitahu kami bahawa panjang kod tidak ada kaitan dengan prestasi. Kaedah 4 mempunyai prestasi keseluruhan yang terbaik (tetapi mengapa prestasi dikurangkan apabila nombor adalah 100, saya benar-benar tidak faham Sebab utamanya ialah:

).

1. Membandingkan kaedah satu dan dua, setiap operasi menggunakan 3 aksara dan bukannya 1 aksara untuk mengurangkan bilangan gelung

2. Berbanding dengan kaedah tiga, lima dan enam, ungkapan biasa tidak digunakan, yang mengurangkan penggunaan.

Akhir sekali, saya memilih kaedah empat sebagai penyelesaian pengoptimuman terakhir. Jika pembaca mempunyai kaedah pelaksanaan yang lebih baik atau cadangan penambahbaikan, anda boleh meninggalkan ulasan.

Label berkaitan:
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan