JavaScript String.Replace () Приклад з RegEx

Регулярні вирази (також звані RegEx або RegExp) - це потужний спосіб аналізу тексту. За допомогою RegEx ви можете зіставляти рядки в точках, які відповідають певним символам (наприклад, JavaScript) або шаблонам (наприклад, NumberStringSymbol - 3a &).

.replaceМетод використовується на рядки в JavaScript для заміни частин рядка з символами. Він часто використовується так:

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

Як ви можете бачити вище, метод replace приймає два аргументи: рядок, який потрібно замінити, і те, чим рядок буде замінений.

Ось де входить Regex .

Використання .replaceвищезазначеного обмежено: символи, які потрібно замінити, відомі - "ava". Що робити, якщо замість цього нас стосується шаблон? Можливо, цифра, дві букви та слово "foo" або три символи, що використовуються разом?

.replaceМетод , який використовується з RegExможе досягти цього. RegExможна ефективно використовувати для відтворення візерунків. Тож поєднуючи це із .replaceзасобами, ми можемо замінити шаблони, а не лише точні символи.

Як використовувати RegExз .replaceу JavaScript

Для використання RegEx, перший аргумент replaceбуде замінено синтаксисом регулярного виразу, наприклад /regex/. Цей синтаксис служить шаблоном, коли будь-які частини рядка, які відповідають йому, будуть замінені новим підрядком.

Ось приклад:

// 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" 

Рядок 3foobar4відповідає регулярному виразу /\d.*\d/, тому його замінюють.

Що, якби ми хотіли провести заміну в кількох місцях?

Regexвже пропонує, що з g(глобальним) прапором, і те саме можна використовувати з replace. Ось як:

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

Звичайний вираз відповідає частинам рядка, які є рівно 3 послідовними числами. 323відповідає йому, 995відповідає йому, 489відповідає йому та 454відповідає йому. Але останнє 5не відповідає шаблону.

Результат JavaScrip5tпоказує, як правильно узгоджуються шаблони, і замінює новим підрядком (порожнім рядком).

Прапор справи - iтакож може бути використаний. Це означає, що ви можете замінити шаблони, що не враховують регістр. Ось як це використовується:

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..не відповідає першому синтаксису, оскільки RegEx за замовчуванням чутливий до регістру. Але при використанні iпрапора, як видно з другого синтаксису, рядок, як очікується, замінено.

Як використовувати спліт із регулярними виразами

splitтакож використовує RegEx. Це означає, що ви можете розділити рядок не тільки на підрядки, які відповідають точним символам, але і шаблонам.

Ось короткий огляд:

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

Рядок був splitу, 64aоскільки ця підрядок відповідає вказаному регулярному виразу.

Зверніть увагу, що глобальний прапор - g- splitне має значення, на відміну від iпрапора та інших прапорів. Це тому, що splitрозбиває рядок на кілька точок, що відповідають регулярному виразу.

Підведенню

RegExробить replaceрядки в JavaScript більш ефективними, потужними та цікавими.

Ви обмежуєтесь не лише точними символами, але шаблонами та кількома замінами одночасно. У цій статті ми на кількох прикладах побачили, як вони працюють разом.

Привітання з RegEx?