Работая со строками, мы часто сталкиваемся с задачей: извлечь часть строки. Например, получить год из даты, имя из полного ФИО или первые несколько символов из адреса электронной почты. Для таких случаев в JavaScript есть удобный инструмент — метод slice().

Что такое подстрока?

Подстрока является частью строки — тем, что входит внутрь другой строки. Например, в строке '12-08-2034' подстрокой может быть '2034', '12' или даже '-'. Всё зависит от того, какую информацию нам нужно извлечь.

Допустим, у нас есть строка с датой '12-08-2034'. Мы хотим получить из неё только год '2034'. В этой строке каждый символ имеет индекс (позицию), начиная с нуля:

'1' '2' '-' '0' '8' '-' '2' '0' '3' '4'
 0   1   2   3   4   5   6   7   8   9

Год начинается с индекса 6 и заканчивается на 9. Чтобы извлечь его, мы используем slice():

const value = '12-08-2034';
const year = value.slice(6, 10);
console.log(year); // => 2034

Запись «значение, точка, имя» — это вызов метода; что такое методы, разберём в уроке про объекты, пока достаточно использовать .slice() по образцу.

Вызов value.slice(6, 10) берёт символы с индекса 6 по 9 включительно. Формат:

строка.slice(начало, конец)

Символ с индексом, указанным как «конец», не включается. Его можно воспринимать как порядковый номер символа, перед которым нужно остановиться.

const value = 'code-basics';

console.log(value.slice(5, 11)); // => basics (с 5 по 10 индекс)
console.log(value.slice(0, 7));  // => code-ba (с 0 по 6 индекс)
console.log(value.slice(2, 6));  // => de-b

Срез возвращает строку

slice() всегда возвращает строку, даже если в ней только цифры. Это значит, что результат можно использовать как обычную строку: конкатенировать, выводить, передавать в функции и снова резать:

const value = '01-12-9873';

const part = value.slice(3, 7); // => 12-9
console.log(part.slice(0, 2));  // => 12

Сначала мы получили подстроку '12-9', а потом сделали из неё новый срез '12'.

Срез до конца или с начала

Если второй аргумент не указать, slice() вернёт всё от стартового индекса до конца строки. А slice(0) или slice() без аргументов вернёт строку целиком:

const value = 'Hexlet';

console.log(value.slice(3));  // => let     // с 3 символа до конца
console.log(value.slice(0, 3)); // => Hex   // от начала до 3 символа
console.log(value.slice());   // => Hexlet  // вся строка

Отрицательные индексы

slice() умеет считать и с конца строки. Для этого используются отрицательные индексы: -1 соответствует последнему символу, -2 — предпоследнему и так далее. Это удобно, когда заранее неизвестна длина строки, но нужно взять «хвост» или «середину» относительно конца:

const value = 'Hexlet';

console.log(value.slice(-1));   // => t   // последний символ
console.log(value.slice(3, -1)); // => le // от 3 до предпоследнего
console.log(value.slice(-3));   // => let // последние три символа

Срез с переменными

Границы среза не обязаны быть жёстко зафиксированы числами. Можно использовать переменные:

const start = 1;
const end = 5;

const value = 'Hexlet';
console.log(value.slice(start, end)); // => exle

Это особенно полезно, когда границы вычисляются во время работы программы.

Чего нет у slice()

В некоторых языках (например, в Python) у среза есть третий параметр — шаг, и им можно, например, взять каждый второй символ или развернуть строку. У метода slice() шага нет. Подобные задачи в JavaScript решают с помощью циклов и других инструментов, к которым мы вернёмся позже.

Существует и похожий метод substring(). Он работает почти как slice(), но не понимает отрицательные индексы (трактует их как 0), поэтому для извлечения «хвоста» строки удобнее slice().

Быстрая шпаргалка

const value = 'Hexlet';

value.slice();      // Hexlet  — вся строка
value.slice(0);     // Hexlet
value.slice(5);     // t
value.slice(0, 5);  // Hexle
value.slice(-1);    // t       — последний символ
value.slice(-3);    // let     — последние три символа
value.slice(2, -1); // xle     — с третьего до предпоследнего

Не переживайте, если сейчас не запомните все комбинации: вы быстро начнёте использовать их на практике. Главное — понимать базовую структуру строка.slice(начало, конец).

Дана константа url = 'https://hexlet.io'. Извлеките и выведите доменное имя без протокола:

hexlet.io

Используйте метод slice().