Понимание регулярных выражений 🗣️ в JavaScript: реальные сценарии и фрагменты кода 🔡 🧑💻
Регулярные выражения, часто сокращенно называемые regex или regexp, являются мощными инструментами для сопоставления с образцом и работы с текстом. В JavaScript регулярные выражения представлены объектами и обеспечивают краткий и гибкий способ работы со строками. В этой статье мы изучим основы регулярных выражений, поймем их синтаксис и углубимся в сценарии из реальной жизни, где они окажутся бесценными. Кроме того, мы предоставим фрагменты кода для демонстрации их практического использования.
1. Что такое регулярные выражения?
Регулярное выражение — это последовательность символов, формирующая шаблон поиска. Он определяет набор правил, которые помогают находить совпадения в строках. Регулярные выражения могут включать литеральные символы, метасимволы и квантификаторы, что позволяет выполнять сложное сопоставление с образцом.
2. Синтаксис регулярных выражений
Регулярные выражения в JavaScript представляются с помощью конструктора RegExp или литерального синтаксиса, заключенного в косую черту (/.../). Наиболее распространенные метасимволы в регулярных выражениях включают:
- . (точка): соответствует любому одиночному символу, кроме символов новой строки.
- *: Соответствует предыдущему символу ноль или более раз.
- +: соответствует предыдущему символу один или несколько раз.
- ?: Соответствует предыдущему символу ноль или один раз.
- |: действует как оператор ИЛИ, сопоставляя либо выражение до, либо после него.
- []: представляет класс символов, соответствующий любому одиночному символу в квадратных скобках.
- ^: соответствует началу строки.
- $: соответствует концу строки.
- () (круглые скобки): группирует выражения.
3. Реальные сценарии
Проверка адресов электронной почты
Регулярные выражения обычно используются для проверки адресов электронной почты на основе определенных шаблонов. Вот фрагмент для проверки адресов электронной почты:
const emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/; function isValidEmail(email) { return emailPattern.test(email); } console.log(isValidEmail('[email protected]')); // Output: true console.log(isValidEmail('invalid-email')); // Output: false
Извлечение информации из текста
Регулярные выражения можно использовать для извлечения определенной информации из текста, например, для извлечения всех чисел из заданной строки:
const text = 'I have 5 apples and 3 oranges.'; const numbersPattern = /\d+/g; const numbers = text.match(numbersPattern); console.log(numbers); // Output: ['5', '3']
Замена текстовых шаблонов
Регулярные выражения полезны для замены определенных шаблонов в строке. Например, замена всех вхождений слова:
const text = 'JavaScript is fun. JavaScript is powerful.'; const replacedText = text.replace(/JavaScript/g, 'TypeScript'); console.log(replacedText); // Output: 'TypeScript is fun. TypeScript is powerful.'
Проверка пароля
Регулярные выражения можно использовать для обеспечения соблюдения правил проверки пароля, таких как требование минимальной длины и определенных символов:
const passwordPattern = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{8,}$/; function isValidPassword(password) { return passwordPattern.test(password); } console.log(isValidPassword('Password123')); // Output: true console.log(isValidPassword('pass')); // Output: false
Проверка номера телефона
Регулярные выражения можно использовать для проверки телефонных номеров на основе определенных форматов. Например, проверка 10-значного номера телефона с необязательным кодом страны:
const phonePattern = /^(\+?\d{1,3})?[-.\s]?\d{3}[-.\s]?\d{3}[-.\s]?\d{4}$/; function isValidPhoneNumber(phoneNumber) { return phonePattern.test(phoneNumber); } console.log(isValidPhoneNumber('+1 123-456-7890')); // Output: true console.log(isValidPhoneNumber('123.456.7890')); // Output: true console.log(isValidPhoneNumber('123456789')); // Output: false (invalid format)
Извлечение URL
Регулярные выражения могут помочь извлечь URL-адреса из блока текста:
const text = 'Visit my website at https://example.com and also check https://github.com/user'; const urlPattern = /https?:\/\/\S+/g; const urls = text.match(urlPattern); console.log(urls); // Output: ['https://example.com', 'https://github.com/user']
Валидация данных
Вы можете использовать регулярные выражения для проверки форматов данных. Например, проверка даты в формате ГГГГ-ММ-ДД:
const datePattern = /^\d{4}-\d{2}-\d{2}$/; function isValidDate(date) { return datePattern.test(date); } console.log(isValidDate('2023-07-26')); // Output: true console.log(isValidDate('23-07-26')); // Output: false (invalid format)
Выделение текстовых совпадений
Регулярные выражения можно использовать для поиска и выделения определенных текстовых совпадений в строке:
const text = 'The quick brown fox jumps over the lazy dog.'; const searchText = 'fox'; const searchPattern = new RegExp(searchText, 'gi'); const highlightedText = text.replace(searchPattern, (match) => `<strong>${match}</strong>`); console.log(highlightedText); // Output: 'The quick brown <strong>fox</strong> jumps over the lazy dog.'
Токенизация
Регулярные выражения могут помочь разбить строку на слова или отдельные символы:
const text = 'Hello, how are you?'; //Tokenizing into words const words = text.match(/\b\w+\b/g); console.log(words); // Output: ['Hello', 'how', 'are', 'you'] //Tokenizing into characters const characters = text.split(''); console.log(characters); // Output: ['H', 'e', 'l', 'l', 'o', ',', ' ', 'h', 'o', 'w', ' ', 'a', 'r', 'e', ' ', 'y', 'o', 'u', '?']
Удаление тега HTML
Регулярные выражения могут помочь удалить теги HTML из строки:
const htmlText = '<p>Hello <strong>world</strong>, how are you?</p>'; const htmlTagPattern = /<[^>]+>/g; const plainText = htmlText.replace(htmlTagPattern, ''); console.log(plainText); // Output: 'Hello world, how are you?'
4. Вывод
Регулярные выражения в JavaScript предлагают мощный и универсальный способ работы со строками. В этой статье мы рассмотрели дополнительные реальные сценарии использования регулярных выражений, такие как проверка номера телефона, извлечение URL-адреса, проверка данных, выделение текстовых совпадений, токенизация и удаление HTML-тегов.
Когда вы станете более опытными в работе с регулярными выражениями, вы обнаружите, что они удобны для сложных задач сопоставления с образцом и работы с текстом. Помните, что регулярные выражения иногда могут быть сложными для чтения и обслуживания, поэтому очень важно добавлять комментарии и тщательно тестировать свои шаблоны, чтобы убедиться, что они ведут себя должным образом. Практикуясь и экспериментируя, вы раскроете весь потенциал регулярных выражений в своих проектах JavaScript. Удачного кодирования!
5. Ссылки
- Веб-документы MDN — Регулярные выражения (JavaScript)
- JavaScript.info - Регулярные выражения
- W3Schools — Объект JavaScript RegExp
- Eloquent JavaScript (книга) — Глава 9: Регулярные выражения
В этой главе подробно рассматриваются регулярные выражения с практическими примерами. - Regular-Expressions.info
Этот веб-сайт предоставляет исчерпывающую информацию о регулярных выражениях, включая руководства, справочные материалы и примеры. - Тестер регулярных выражений JavaScript
Онлайн-инструмент для тестирования и экспериментов с регулярными выражениями JavaScript.
Находите эту статью полезной? Ставь лайк или комментарий.
Грациас 🙏.