Rumah > hujung hadapan web > tutorial js > Penggunaan kaedah replace() dalam kemahiran javascript_javascript

Penggunaan kaedah replace() dalam kemahiran javascript_javascript

WBOY
Lepaskan: 2016-05-16 16:02:41
asal
1284 orang telah melayarinya

Saya sedang menyemak imbas beberapa soalan temu duga bahagian hadapan Alibaba baru-baru ini, dan salah satu daripadanya melibatkan penggunaan kaedah replace() dalam JavaScript Berikut ialah soalan asal:

“Beritahu saya apa fungsi berikut lakukan? Apakah yang perlu diisi dalam ruang kosong?”

 // define 
 (function (window) { 
   function fn(str) { 
     this.str = str; 
   } 
   fn.prototype.format = function () { 
     var arg = ______; 
     return this.str.replace(_______, function (a, b) { 
       return arg[b] || ''; 
     }); 
   } 
   window.fn = fn; 
 })(window); 
 // use 
 (function(){ 
   var t = new fn('<p><a href="{0}">{1}</a><span>{2}</span></p>');
   console.log( t.format('http://www.alibaba.com', 'Alibaba', 'Welcome') ); 
 })();

Salin selepas log masuk

Berikut adalah proses analisis (rasanya lebih baik untuk menomborkannya, secara peribadi saya rasa ia lebih teratur)

1. Kerana soalan ini juga melibatkan mata pengetahuan lain, seperti fungsi tanpa nama, prototaip, dll., tetapi ia bukan fokus perbincangan ini.

2. Mengikut soalan, kita tahu kod sumber soalan ini serupa dengan menulis enjin templat. Gantikan ruang letak seperti '{1}' dalam templat dengan parameter yang dihantar kepadanya. Jadi arg sepatutnya menjadi hujah. tetapi! ! ! Memandangkan arg bukan tatasusunan, tetapi objek seperti tatasusunan (jika anda tidak faham, anda boleh google sendiri (u_u)), jadi kami perlu melakukan beberapa penukaran,

Salin kod Kod adalah seperti berikut:
var arg=Array.prototype.slice.call(arguments ,0) ;

3. Bahagian kanan tanda sama ialah jawapan kosong pertama. Setelah berkata begitu banyak, maka ruang kedua adalah fokus perbincangan kami~~~~~~Kita semua tahu bahawa ruang kedua adalah untuk mencari ruang letak melalui ungkapan biasa dan menukarnya mengikut nombor dalam ruang letak rentetan dalam tatasusunan arg. Sejujurnya, jarang ditemui bahawa parameter kedua bagi kaedah ganti ialah suatu fungsi

Salin kod Kod adalah seperti berikut:
corak var=/8(.*)8/;
var str='Ini ialah 8baidu8';
document.write(str.replace(corak,'$1'));

4 Memandangkan terdapat sedikit situasi di mana parameter kedua pengganti ialah fungsi, mari kita fokus pada situasi di mana parameter kedua ialah fungsi.

Pertama sekali, ini ialah sintaks bagi fungsi ganti: stringobject.replace(regexp/substr,replacement)

Di mana regexp/substr diperlukan. Objek regexp yang menentukan rentetan atau corak yang akan diganti. (Perhatikan bahawa jika nilai ialah rentetan, ia diambil semula sebagai corak literal literal dan bukannya ditukar terlebih dahulu kepada objek regexp.) penggantian diperlukan. Nilai rentetan. Menentukan fungsi untuk menggantikan teks atau menjana teks gantian. Akhirnya, rentetan baharu dikembalikan, yang diperoleh selepas menggantikan padanan pertama atau semua padanan regexp dengan penggantian.

5. ECMAScript menetapkan bahawa penggantian parameter kaedah replace() boleh menjadi fungsi dan bukannya rentetan. Dalam kes ini, fungsi dipanggil untuk setiap padanan dan rentetan yang dipulangkan digunakan sebagai teks gantian. Parameter pertama mewakili aksara yang dipadankan, parameter kedua mewakili kedudukan indeks minimum aksara yang dipadankan (RegExp.index), dan parameter ketiga mewakili rentetan yang dipadankan (RegExp.input).

6. Jadi ruang kedua boleh ditulis seperti ini: /{(d )}/g, dan ayat lengkap apabila diletakkan dalam pernyataan ialah:

kembalikan this.str.replace(/{(d )}/g, fungsi (a, b) {
Kembalikan arg[b] || });



Apabila melakukan perlawanan pertama, {0} digantikan dengan arg[0]
Apabila melakukan perlawanan pertama, {1} digantikan dengan arg[1] Apabila melakukan perlawanan pertama, {2} digantikan dengan arg[2]


7. Di atas adalah penjelasan parameter kedua kaedah rentetan js replace() sebagai fungsi (jika terdapat sebarang ketidaksempurnaan, sila tambah sendiri, soalan temuduga ini juga telah diselesaikan~ ~~~~

Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.

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