Объект RegExp JavaScript

Что такое регулярное выражение?

Регулярное выражение — это последовательность символов, образующая поиск. узор.

Когда вы ищете данные в тексте, вы можете использовать этот шаблон поиска, чтобы описать то, что вы ищете.

Регулярное выражение может представлять собой один символ или более сложный шаблон.

Регулярные выражения можно использовать для выполнения всех типов текстового поиска. и операции замены текста.

Синтаксис

/pattern/modifiers;

Пример

/w3schools/i;

Пример объяснен:

/w3schools/i - регулярное выражение.

w3schools - это шаблон (для использования при поиске).

i — модификатор (изменяет поиск без учета регистра).

Использование строковых методов

В JavaScript регулярные выражения часто используются с двумя строками методы: search() и replace().

Метод search() использует выражение для поиска match и возвращает позицию совпадения.

Метод replace() возвращает измененную строку, в которой узор заменен.

Использование строки `search()` со строкой

Метод search() ищет в строке указанное значение и возвращает позицию совпадения:

Пример

Используйте строку для поиска «W3schools» в строке:

let text = "Visit W3Schools!";
let n = text.search("W3Schools");

Результатом в n будет:

6

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript String Methods</h1>
<p>Search a string for &quot;W3Schools&quot;, and display the position of the match:</p>

<p id="demo"></p>

<script>
let text = "Visit W3Schools!"; 
let n = text.search("W3Schools");
document.getElementById("demo").innerHTML = n;
</script>

</body>
</html>

Использование строки `search()` с регулярным выражением

Пример

Используйте регулярное выражение для поиска «w3schools» без учета регистра в строке:

let text = "Visit W3Schools";
let n = text.search(/w3schools/i);

Результатом в n будет:

6

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Search a string for "w3Schools", and display the position of the match:</p>

<p id="demo"></p>

<script>
let text = "Visit W3Schools!"; 
let n = text.search(/w3Schools/i);
document.getElementById("demo").innerHTML = n;
</script>

</body>
</html>

Использование строки `replace()` со строкой

Метод replace() заменяет указанное значение другим значением в строке:

let text = "Visit Microsoft!";
let result = text.replace("Microsoft", "W3Schools");

Попробуйте сами →

<!DOCTYPE html>
<html>

<body>

<h1>JavaScript String Methods</h1>
<p>Replace &quot;Microsoft&quot; with &quot;W3Schools&quot; in the paragraph below:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Please visit Microsoft!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML;
  document.getElementById("demo").innerHTML =
  text.replace("Microsoft","W3Schools");
}
</script>

</body>
</html>

Используйте строку `replace()` с регулярным выражением

Пример

Используйте регулярное выражение без учета регистра, чтобы заменить Microsoft на W3Schools. в строке:

let text = "Visit Microsoft!";
let result = text.replace(/microsoft/i, "W3Schools");

Результат в res будет:

Visit W3Schools!

Попробуйте сами →

<!DOCTYPE html>
<html>

<body>

<h2>JavaScript String Methods</h2>

<p>Replace "Microsoft" with "W3Schools" in the paragraph below:</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Please visit Microsoft!</p>

<script>
function myFunction() {
  let text = document.getElementById("demo").innerHTML;
  document.getElementById("demo").innerHTML =
  text.replace(/microsoft/i, "W3Schools");
}
</script>

</body>
</html>

Ты заметил?

В приведенных выше методах можно использовать аргументы регулярного выражения (вместо строковых аргументов).
Регулярные выражения могут сделать ваш поиск намного более эффективным (например, без учета регистра).

Модификаторы регулярных выражений

Модификаторы можно использовать для выполнения более глобального поиска без учета регистра:

Модификатор:

Описание: выполнение сопоставления без учета регистра.

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a case-insensitive search for "w3schools" in a string:</p>

<p id="demo"></p>

<script>
let text = "Visit W3Schools";
let result = text.match(/w3schools/i);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Модификатор:

Описание: выполнить глобальное сопоставление (найти все совпадения, а не останавливаться после первого совпадения).

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for "is" in a string:</p>

<p id="demo"></p>

<script>
let text = "Is this all there is?";
let result = text.match(/is/g);
document.getElementById("demo").innerHTML = result; 
</script>

</body>
</html>

Модификатор:

Описание: выполнение многострочного сопоставления.

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a multiline search for "is" at the beginning of each line in a string:</p>

<p id="demo"></p>

<script>
let text = "\nIs th\nis it?";
let result = text.match(/^is/m);
document.getElementById("demo").innerHTML = "Result is: " + result;
</script>

</body>
</html>

Шаблоны регулярных выражений

Квадратные скобки используются для поиска диапазона символов:

Модификатор:

[abc]

Описание: найдите любой символ в скобках.

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for the character "h" in a string:</p>

<p id="demo"></p>

<script>
let text = "Is this all there is?";
let result = text.match(/[h]/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Модификатор:

[0-9]

Описание: найдите любую цифру в скобках.

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for the numbers 1 to 4 in a string:</p>

<p id="demo"></p>

<script>
let text = "123456789";
let result = text.match(/[1-4]/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Модификатор:

(x|y)

Описание: Найдите любую альтернативу, разделенную знаком |

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for any of the specified alternatives (red|green):</p>

<p id="demo"></p>

<script>
let text = "re, green, red, green, gren, gr, blue, yellow";
let result = text.match(/(red|green)/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Метасимволы - это символы, имеющие особое значение:

Модификатор:

\d

Описание: Найдите цифру.

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for digits in a string:</p>

<p id="demo"></p>

<script>
let text = "Give 100%!"; 
let result = text.match(/\d/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Модификатор:

\s

Описание: поиск пробельного символа.

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for whitespace characters in a string:</p>

<p id="demo"></p>

<script>
let text = "Is this all there is?";
let result = text.match(/\s/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Модификатор:

\b

Описание. Найдите совпадение в начале слова, например: \bWORD, или в конце слова. вот так: СЛОВО\b

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Search for the characters "LO" in the <b>beginning</b> of a word in the phrase:</p>
<p>"HELLO, LOOK AT YOU!"</p>

<p>Found in position: <span id="demo"></span></p>

<script>
let text = "HELLO, LOOK AT YOU!"; 
let result = text.search(/\bLO/);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Search for the characters "LO" in the <b>end</b> of a word in the phrase:</p>
<p>"HELLO, LOOK AT YOU!"</p>

<p>Found in position: <span id="demo"></span></p>

<script>
let text = "HELLO, LOOK AT YOU!"; 
let result = text.search(/LO\b/);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Модификатор:

\uxxxx

Описание. Найдите символ Юникода, заданный шестнадцатеричным числом xxxx.

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for the hexadecimal number 0057 (W) in a string:</p>

<p id="demo"></p>

<script>
let text = "Visit W3Schools. Hello World!"; 
let result = text.match(/\u0057/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Кванторы определяют количества:

Модификатор:

n+

Описание: Соответствует любой строке, содержащей хотя бы один n

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for at least one "o" in a string:</p>

<p id="demo"></p>

<script>
let text = "Hellooo World! Hello W3Schools!"; 
let result = text.match(/o+/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Модификатор:

n*

Описание: Соответствует любой строке, содержащей ноль или более вхождений n

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for an "l", followed by zero or more "o" characters:</p>

<p id="demo"></p>

<script>
let text = "Hellooo World! Hello W3Schools!"; 
let result = text.match(/lo*/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Модификатор:

n?

Описание: Соответствует любой строке, содержащей ноль или одно вхождение n

Попробуйте →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Do a global search for a "1", followed by zero or one "0" characters:</p>

<p id="demo"></p>

<script>
let text = "1, 100 or 1000?";
let result = text.match(/10?/g);
document.getElementById("demo").innerHTML = result;
</script>

</body>
</html>

Использование объекта RegExp

В JavaScript объект RegExp представляет собой объект регулярного выражения с предопределенные свойства и методы.

Использование теста()

Метод test() — это метод выражения RegExp.

Он ищет строку по шаблону и возвращает true или ложь, в зависимости от результата.

В следующем примере выполняется поиск в строке символа «e»:

Пример

const pattern = /e/;
pattern.test("The best things in life are free!");

Поскольку в строке есть буква «e», вывод приведенного выше кода будет:

true

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p>Search for an "e" in the next paragraph:</p>

<p id="p01">The best things in life are free!</p>

<p id="demo"></p>

<script>
let text = document.getElementById("p01").innerHTML;
const pattern = /e/;
document.getElementById("demo").innerHTML = pattern.test(text);
</script>

</body>
</html>

Вам не обязательно сначала помещать регулярное выражение в переменную. Два строки выше можно сократить до одной:

/e/.test("The best things in life are free!");

Использование exec()

Метод exec() является методом выражения RegExp.

Он ищет строку по указанному шаблону и возвращает найденный текст в виде объект.

Если совпадение не найдено, возвращается пустой объект (null).

В следующем примере выполняется поиск в строке символа «e»:

Пример

/e/.exec("The best things in life are free!");

Попробуйте сами →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Regular Expressions</h2>

<p id="demo"></p>

<script>
const obj = /e/.exec("The best things in life are free!");
document.getElementById("demo").innerHTML =
"Found " + obj[0] + " in position " + obj.index + " in the text: " + obj.input;
</script>

</body>
</html>

Полный справочник регулярных выражений

Для получения полной информации перейдите к нашему Полному Справочник по регулярным выражениям JavaScript.

Справочник содержит описания и примеры всех RegExp. свойства и методы.

Объект RegExp JavaScript

Оглавление

Что такое регулярное выражение?

Синтаксис

Пример

Использование строковых методов

Использование строки search() со строкой

Пример

Использование строки search() с регулярным выражением

Пример

Использование строки replace() со строкой

Используйте строку replace() с регулярным выражением

Пример

Ты заметил?

Модификаторы регулярных выражений

Шаблоны регулярных выражений

Использование объекта RegExp

Использование теста()

Пример

Использование exec()

Пример

Полный справочник регулярных выражений

Использование строки `search()` со строкой

Использование строки `search()` с регулярным выражением

Использование строки `replace()` со строкой

Используйте строку `replace()` с регулярным выражением