Эта статья представляет собой расшифровку моей бесплатной серии YouTube об основах веб-разработки. Если вы предпочитаете смотреть, а не читать, посетите мой канал Dev Newbs.

Привет и добро пожаловать в следующий эпизод, мои коллеги-разработчики! Сегодня будем резать и резать. Метод дня — slice(), не путайте с другим методом slice(). Ха-ха! Как будто кто-то может их спутать, верно?

Метод slice() извлекает части строки и возвращает извлеченные части в новой строке. Первый параметр является обязательным и указывает начальную позицию для извлечения. Второй параметр является необязательным и указывает позицию до окончания извлечения, но не включая ее. Если мы опустим этот параметр, нарезанная подстрока будет идти от начальной позиции до конца строки.

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

Давайте посмотрим, из-за чего вся эта суета в первом примере.

const str = "Hello Dev Newbs!";
// length of the string
"Length: " + str.length                          // Length: 16
// getting the whole string
str.slice()                                      // Hello Dev Newbs!
// start slice at position 6 (7th character)
str.slice(6)                                     // Dev Newbs!
// using negative start position 
// length + negative value = position
// 16 - 10 = 6 -> start slice at 
// position 6 (7th character)
str.slice(-10)                                   // Dev Newbs!
// start slice at position 10 (11th character) 
// & end at position 14 (15th character)
str.slice(10, 15)                                // Newbs
// using negative positions
// 16 - 6 = 10 -> start slice at 
// position 10 (11th character)
// 16 - 1 = 15 -> end slice at 
// position 15 (16th character)
str.slice(-6, -1)                                // Newbs

Сначала мы получаем длину строки, с которой будем работать. Он состоит из 16 символов. Эта информация будет важна для отрицательных позиций позже.

Первый случай — базовое использование. Если мы ничего не указываем, используется вся строка. Так что это не очень полезно, так как мы хотим нарезать только часть строки, верно? Тогда исправим.

Второй случай начинается с индекса 6, что означает, что первый символ в нарезанной подстроке является 7-м символом. Конечную позицию мы не указывали, поэтому все остальное брали до конца.

Следующий случай — тот же результат, только на этот раз мы использовали отрицательное значение для начальной позиции. Вы можете рассчитать, какой индекс вы получите, добавив отрицательное значение к длине вашей строки.

Последние два случая опять идентичны. Они оба получают один и тот же срез, только первый из них использует положительные индексы для начала и конца. Второй использует отрицательные значения. Результат, впрочем, тот же.

И я думаю, что это все. Я не так много могу вам показать. Что ж, мы можем попробовать какие-нибудь глупые параметры на входе. И мы можем видеть, что мы получаем. Но это все!

// using boolean instead of integer -> start = 0, end = 1 
str.slice(false, true)                               // H
// start index bigger than end -> nothing to slice
str.slice(6, 0)                                      // empty string
// math equation as parameters -> start = 6, end = 15 
str.slice((4*true+true+15/3), Math.floor(11.4)+29/7) // Newbs
// using global constants as zero value
str.slice(undefined, 5)                              // Hello

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

Если мы попытаемся выполнить нарезку с начальной позицией больше, чем с конечной позицией, мы ничего не получим. Это вроде бы очевидно, но в любом случае приятно видеть это на примере… ну, чтобы убедиться.

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

И, наконец, такие константы, как undefined или null, также могут быть интерпретированы как ноль. Я не рекомендую использовать их как таковые, но если есть какой-то редкий случай, когда вы вынуждены это сделать, это выполнимо.

И вот так мы закончили с этим методом. Это было довольно приятное завершение недели.

Как обычно, спасибо за ваше внимание, и скоро увидимся.