String JavaScript.Ganti () Contoh dengan RegEx

Ungkapan Biasa (juga disebut RegEx atau RegExp) adalah kaedah yang kuat untuk menganalisis teks. Dengan RegEx, anda dapat memadankan rentetan pada titik yang sesuai dengan watak tertentu (misalnya, JavaScript) atau corak (misalnya, NumberStringSymbol - 3a &).

The .replacekaedah yang digunakan pada tali dalam JavaScript untuk menggantikan bahagian rentetan dengan watak-watak. Ia sering digunakan seperti:

const str = 'JavaScript'; const newStr = str.replace("ava", "-"); console.log(newStr); // J-Script 

Seperti yang anda lihat di atas, kaedah ganti menerima dua argumen: rentetan yang akan diganti, dan tali yang akan diganti.

Di sinilah Regex masuk.

Penggunaan di .replaceatas adalah terhad: watak yang akan diganti diketahui - "ava". Bagaimana jika kita mementingkan corak? Mungkin, nombor, dua huruf, dan perkataan "foo" atau tiga simbol digunakan bersama?

The .replaceKaedah yang digunakan dengan RegExboleh mencapai matlamat ini. RegExdapat digunakan dengan berkesan untuk mencipta corak. Oleh itu, menggabungkan ini dengan .replacecara kita dapat menggantikan corak dan bukan hanya watak yang tepat.

Cara menggunakan RegExdengan .replacedalam JavaScript

Untuk menggunakan RegEx, argumen pertama replaceakan diganti dengan sintaks regex, misalnya /regex/. Sintaks ini berfungsi sebagai corak di mana bahagian rentetan yang sesuai dengannya akan diganti dengan substring baru.

Inilah contohnya:

// matches a number, some characters and another number const reg = /\d.*\d/ const str = "Java3foobar4Script" const newStr = str.replace(reg, "-"); console.log(newStr); // "Java-Script" 

Rentetan itu 3foobar4sesuai dengan regex /\d.*\d/, jadi diganti.

Bagaimana jika kita mahu melakukan penggantian di beberapa tempat?

Regexsudah menawarkannya dengan gbendera (global), dan yang sama dapat digunakan dengan replace. Ini caranya:

const reg = /\d{3}/g const str = "Java323Scr995ip4894545t"; const newStr = str.replace(reg, ""); console.log(newStr); // JavaScrip5t // 5 didn't pass the test :( 

Regex sepadan dengan bahagian rentetan yang betul-betul 3 nombor berturut-turut. 323memadankannya, 995memadankannya, 489memadankannya, dan 454memadankannya. Tetapi yang terakhir 5tidak sesuai dengan corak.

Hasilnya adalah JavaScrip5tmenunjukkan bagaimana corak dipadankan dengan betul dan diganti dengan substring baru (tali kosong).

Bendera kes - ijuga boleh digunakan. Ini bermaksud anda boleh menggantikan corak peka huruf besar kecil. Inilah cara penggunaannya:

const reg1 = /\dA/ const reg2 = /\dA/i const str = "Jav5ascript" const newStr1 = str.replace(reg1, "--"); const newStr2 = str.replace(reg2, "--"); console.log(newStr1) // Jav5ascript console.log(newStr2) // Jav--script 

..5a..tidak sepadan dengan sintaks pertama kerana RegEx secara lalai peka huruf besar kecil. Tetapi dengan penggunaan ibendera, seperti yang terlihat pada sintaks kedua, rentetan seperti yang diharapkan - diganti.

Cara menggunakan Split dengan Ungkapan Biasa

splitjuga menggunakan RegEx. Yang bermaksud anda boleh membelah rentetan bukan hanya pada substring yang sesuai dengan watak yang tepat, tetapi juga corak.

Inilah pandangan ringkas:

const regex = /\d{2}a/; const str = "Hello54 How 64aare you"; console.log(str.split(regex)) // ["Hello54 How ", "are you"] 

Rentetan itu splitberada 64akerana substring sesuai dengan regex yang ditentukan.

Perhatikan bahawa bendera global - g- splitin tidak relevan, tidak seperti ibendera dan bendera lain. Ini kerana splitmembelah rentetan pada beberapa titik yang sesuai dengan regex.

Mengakhiri

RegExmenjadikan replacerentetan dalam JavaScript lebih berkesan, hebat, dan menyeronokkan.

Anda tidak hanya terhad kepada watak yang tepat tetapi corak dan pelbagai penggantian sekaligus. Dalam artikel ini, kami telah melihat bagaimana mereka bekerjasama menggunakan beberapa contoh.

Bersorak untuk RegEx?