Приклади підрядків JavaScript - методи зрізу, підстроки та підрядків у JS

У щоденному програмуванні нам часто потрібно працювати зі рядками. На щастя, в JavaScript є багато вбудованих методів, які допомагають нам під час роботи з масивами, рядками та іншими типами даних. Ми можемо використовувати ці методи для різних операцій, таких як пошук, заміна, конкатенація рядків тощо.

Отримання підрядка з рядка - одна з найпоширеніших операцій у JavaScript. У цій статті ви збираєтеся навчитися отримувати підрядок за допомогою 3 різних вбудованих методів. Але спочатку дозвольте коротко пояснити, що таке підрядок.

Що таке підрядок?

Підрядок - це підмножина іншого рядка:

"I am learning JavaScript and it is cool!" --> Original String "I am learning JavaScript" --> Substring "JavaScript is cool!" --> Another Substring

Як у прикладі вище, у деяких випадках нам потрібно отримати один або кілька підрядків із повного речення або абзацу. Тепер давайте подивимося, як це зробити в JavaScript трьома різними способами.

Ви також можете переглянути відеоверсію прикладу використання тут:

1. Метод substring ()

Почнемо з методу substring (). Цей метод в основному отримує частину вихідного рядка і повертає його як новий рядок. Метод підрядка передбачає два параметри:

string.substring(startIndex, endIndex);
  • startIndex : представляє початкову точку підрядка
  • endIndex : представляє кінцеву точку підрядка (необов’язково)

Давайте подивимось використання на прикладі. Припустимо, що у нас є приклад рядка нижче:

const myString = "I am learning JavaScript and it is cool!";

Тепер, якщо ми встановимо startIndex як 0, а endIndex як 10, то ми отримаємо перші 10 символів вихідного рядка:

Однак, якщо ми встановимо лише початковий індекс, а не кінцевий індекс для цього прикладу:

Тоді ми отримуємо підрядок, починаючи з 6-го символу і закінчуючи вихідним рядком.

Деякі додаткові моменти:

  • Якщо startIndex = endIndex, метод підрядка повертає порожній рядок
  • Якщо startIndex і endIndex більше, ніж довжина рядка, він повертає порожній рядок
  • Якщо startIndex> endIndex, то метод підрядка міняє місцями аргументи і повертає підрядок, вважаючи, що endIndex> startIndex

2. Метод зрізу ()

Метод slice () подібний до методу substring (), а також повертає підрядок вихідного рядка. Метод зрізу також передбачає ті самі два параметри:

string.slice(startIndex, endIndex);
  • startIndex : представляє початкову точку підрядка
  • endIndex : представляє кінцеву точку підрядка (необов’язково)

Загальні точки методів substring () та slice ():

  • Якщо ми не встановлюємо кінцевий індекс, тоді ми отримуємо підрядок, починаючи з заданого номера індексу і закінчуючи вихідним рядком:
  • Якщо ми встановимо і startIndex, і endIndex, то ми отримаємо символи між заданими номерами індексу вихідного рядка:
  • Якщо startIndex та endIndex перевищують довжину рядка, він повертає порожній рядок

Відмінності методу slice ():

  • Якщо startIndex> endIndex, метод slice () повертає порожній рядок
  • Якщо startIndex є від'ємним числом, то перший символ починається з кінця рядка (зворотний):
Примітка: Ми можемо використовувати метод slice () також для масивів JavaScript. Ви можете знайти тут мою іншу статтю про метод зрізу, щоб побачити використання масивів.

3. Метод substr ()

Згідно з документами Mozilla, метод substr () вважається застарілою функцією, і слід уникати його використання. Але я все одно коротко пояснитиму, що це робить, тому що ви можете це побачити у старих проектах.

Метод substr () також повертає підрядок вихідного рядка і очікує два параметри як:

string.substring(startIndex, length);
  • startIndex : представляє початкову точку підрядка
  • довжина : кількість символів, які слід включити (необов’язково)

Ви бачите різницю тут: метод substr () очікує другий параметр як довжину замість endIndex:

У цьому прикладі він в основному нараховує 5 символів, починаючи з заданого startIndex, і повертає їх як підрядок.

Однак, якщо ми не визначаємо другий параметр, він повертається до кінця вихідного рядка (як це роблять попередні два методи):

Примітка: Усі 3 методи повертають підрядок як новий рядок, і вони не змінюють початковий рядок.

Загорнути

Отже, це 3 різні методи отримання підрядка в JavaScript. У JS є багато інших вбудованих методів, які справді дуже допомагають нам у роботі з різними речами програмування. Якщо ви вважаєте цю публікацію корисною, поділіться нею в соціальних мережах.

Якщо ви хочете дізнатись більше про веб-розробку, сміливо стежте за мною на Youtube !

Дякую за читання!