В повседневном программировании нам часто приходится работать со строками. К счастью, в JavaScript существует множество встроенных методов, которые помогают нам при работе с массивами, строками и другими типами данных. Мы можем использовать эти методы для различных операций, таких как поиск, замена, конкатенация строк и так далее.
Получение подстроки из строки – одна из самых распространенных операций в JavaScript. В этой статье вы узнаете, как получить подстроку с помощью трех различных встроенных методов. Но сначала позвольте мне вкратце объяснить, что такое подстрока.
Что такое подстрока?
Подстрока – это подмножество другой строки:
"I am learning JavaScript and it is cool!" --> Original String "I am learning JavaScript" --> Substring "JavaScript is cool!" --> Another Substring
Как и в приведенном выше примере, в некоторых случаях нам нужно получить одну или несколько подстрок из полного предложения или абзаца. Теперь давайте посмотрим, как это сделать в JavaScript 3 различными способами.
Вы также можете посмотреть видеоверсию примеров использования здесь:
1. Метод substring()
Начнем с метода substring(). Этот метод в основном получает часть исходной строки и возвращает ее в виде новой строки. Метод substring принимает два параметра:
string.substring(startIndex, endIndex);
- startIndex: представляет начальную точку подстроки
- endIndex: представляет конечную точку подстроки (необязательно).
Давайте рассмотрим использование на примере. Предположим, что у нас есть пример строки ниже:
const myString = "I am learning JavaScript and it is cool!";
Теперь, если мы установим startIndex равным 0, а endIndex равным 10, то получим первые 10 символов исходной строки:

Однако, если для данного примера мы зададим только начальный индекс и никакого конечного индекса:

Затем мы получаем подстроку, начиная с 6-го символа и до конца исходной строки.
Некоторые тонкости substring:
- Если startIndex = endIndex, метод substring возвращает пустую строку.
- Если startIndex и endIndex оба больше длины строки, то возвращается пустая строка
- Если startIndex больше endIndex, то метод подстроки меняет аргументы местами и возвращает подстроку, предполагая, что endIndex меньше startIndex.
2. Метод slice()
Метод slice() аналогичен методу substring() и также возвращает подстроку исходной строки. Метод slice также ожидает те же два параметра:
string.slice(startIndex, endIndex);
- startIndex: представляет начальную точку подстроки
- endIndex: представляет конечную точку подстроки (необязательно).
Общие моменты методов substring() и slice():
- Если мы не задаем endIndex, то получаем подстроку, начинающуюся с заданного номера индекса, до конца исходной строки:
- Если мы зададим и startIndex, и endIndex, то получим символы между заданными индексными номерами исходной строки:
- Если startIndex и endIndex больше длины строки, то возвращается пустая строка.
Отличия метода slice():
- Если startIndex больше endIndex, метод slice() возвращает пустую строку.
- Если startIndex – отрицательное число, то первый символ начинается с конца строки (реверс):
Примечание: Мы можем использовать метод slice() также для массивов JavaScript. Вы можете найти здесь мою другую статью о методе slice, чтобы увидеть его использование для массивов.
3. Метод substr()
Согласно документам Mozilla, метод substr() считается устаревшей функцией, и его использования следует избегать. Но я все же кратко объясню, что он делает, потому что вы можете встретить его в старых проектах.
Метод substr() также возвращает подстроку исходной строки и ожидает два параметра:
string.subst(startIndex, length);
- startIndex: представляет собой начальную точку подстроки
- length: количество символов, которые должны быть включены (необязательно).
Здесь вы можете увидеть разницу: метод substr() ожидает второй параметр как длину вместо endIndex:
В этом примере он, по сути, считает 5 символов, начинающихся с заданного startIndex, и возвращает их в качестве подстроки.
Однако, если мы не зададим второй параметр, он вернет до конца исходной строки (как и предыдущие два метода):
Примечание: Все 3 метода возвращают подстроку как новую строку и не изменяют исходную строку.
Заключение
Итак, это 3 различных метода получения подстроки в JavaScript. В JS существует множество других встроенных методов, которые действительно помогают нам при решении различных задач в программировании. Если вы нашли этот пост полезным, пожалуйста, поделитесь им в социальных сетях.
Спасибо, за прочтение!
Оригинал: “https://www.freecodecamp.org/news/javascript-substring-examples-slice-substr-and-substring-methods-in-js/”