Разделение строки на подстроки: split() с несколькими разделителями

Быстрый ответ

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

const text = "I, for one; like Roman numerals.";
// Регулярное выражение разбивает строку по запятым, пробелам и точкам с запятой
const splitText = text.split(/[, ;]+/);

Результат: ["I", "for", "one", "like", "Roman", "numerals."]. Мы создали регулярное выражение, которое использует запятые, пробелы и точки с запятой в качестве разделителей. Подстроить регулярное выражение под конкретные требования задачи можно, изменив эти символы.

Разбор синтаксиса регулярных выражений

Регулярные выражения (regex) — мощный инструмент для обработки строк. Для разбиения строк с разными разделителями нам помогут следующие элементы синтаксиса:

• Квадратные скобки [] формируют набор символов. Соответствие устанавливается с любым из символов, перечисленных внутри скобок.
• Плюс + указывает, что предшествующий элемент должен встречаться один или более раз.
• Незахватывающие группы (?:) дают возможность создать группу символов, не влияя на последующий сформированный массив.

Пример использования в коде:

const longWords = "Pneumonoultramicroscopicsilicovolcanoconiosis, Hippopotomonstrosesquippedaliophobia. Floccinaucinihilipilification;Supercalifragilisticexpialidocious";
// Регулярное выражение для разбиения по запятой, пробелу, точке и точке с запятой
const words = longWords.split(/[, .;]+/);

Здесь /[, .;]+/ показывает, что разбиение осуществляется по любому из символов: запятой, пробелу, точке или точке с запятой, при этом группа разделителей воспринимается как единый. Удивительно, насколько упрощает жизнь использование регулярных выражений!

Работа с особыми случаями

При работе со строками и разделителями или при сложной обработке строк следует учеть:

• Если совпадения не найдено, строка вернется в виде массива из одного элемента.
• Чтобы избавиться от лишних разделителей в результате, используйте незахватывающие группы в регулярном выражении.
• Проверяйте ваше регулярное выражение на различных примерах строк и особых случаях.
• Помните о различиях в поддержке регулярных выражений разными браузерами. Даже у Internet Explorer есть свои особенности!

Визуализация

Представьте себе, что разделители – это умелые мастера икебаны (🌸), создающие композиции из разнообразных цветочков. Ваша строка – это восхитительный букет слов (one, two, three, four), соединенных разделителями (,, ;, ):

Букет из слов: "one,two;three four"
Ленточки-разделители: [',', ';', ' ']

Метод split аккуратно разрезает эти ленточки, превращая их в искусственное цветоводство:

// Используем `.split()` и регулярное выражение, чтобы разделить слова
"one,two;three four".split(/[,; ]+/);

В итоге мы получаем прекрасный цветочный ансамбль:

Готовый цветочный ансамбль: ['one', 'two', 'three', 'four']

Примеры для сложных условий использования

Объединение разделителей перед разбиением для предотвращения проблем

При работе со сложными строками, содержащими вложенные разделители, могут возникнуть трудности. В таких случаях помощником станет метод replace, позволяющий объединить все разделители в один прежде, чем применять split:

const crypticText = "one |two ;; three,four";
const harmonizedText = crypticText.replace(/[,|; ]+/g, ' '); // Объединяем разделители в пробел
const splitResult = harmonizedText.split(' '); // Производим разбиение по пробелу

Подробнее об этом расскажет наш спикер на видео

Создание собственной функции для точного разделения

Если требуется более глубокий контроль над процессом, можно инкапсулировать метод split() в собственную функцию:

function preciseSplit(string, separators) {
  // Кистью-художника собираем регулярное выражение
  const pattern = new RegExp(`[${separators.join('')}]+`);
  // Получаем результат в виде массива
  return string.split(pattern);
}

const tailoredSplit = preciseSplit("one, two; three four", [',', ';', ' ']);

Не забывайте следить за тем, чтобы не возникло конфликтов при расширении прототипов стандартных объектов!

Полезные материалы

1. String.prototype.split() – JavaScript | MDN
2. Как разделить строку с использованием нескольких разделителей в JavaScript? – Stack Overflow
3. regex101: создайте, протестируйте и отладьте регулярное выражение
4. Метод String.split() в JavaScript
5. Шаблоны и флаги
6. RegexOne – изучите регулярные выражения – урок 1: Введение и основы
7. Регулярные выражения :: Выразительный JavaScript