Вбудовані методи JavaScript дуже допомагають нам під час програмування, як тільки ми їх правильно розуміємо. Я хотів би пояснити три з них в цій статті: про slice()
, splice()
і split()
методи. Можливо, через те, що їхні імена так схожі, їх часто плутають навіть серед досвідчених розробників.
Я раджу студентам та молодшим розробникам уважно прочитати цю статтю, оскільки ці три методи також можна задати в ІНТЕРВ'Ю РОБОТИ.
Зрештою, ви можете знайти короткий опис кожного методу. Якщо ви хочете, ви також можете переглянути відеоверсію нижче:
Отже, почнемо ...
Масиви JavaScript
По-перше, вам потрібно зрозуміти, як працюють масиви JavaScript . Як і в інших мовах програмування, ми використовуємо масиви для зберігання кількох даних у JS. Але різниця полягає в тому, що масиви JS можуть містити дані різного типу одночасно.
Іноді нам потрібно робити операції з цими масивами. Тоді ми використовуємо деякі методи JS, такі як slice () та splice () . Нижче ви можете побачити, як оголосити масив у JavaScript:
let arrayDefinition = []; // Array declaration in JS
Тепер оголосимо інший масив з різними типами даних. Я буду використовувати його нижче в прикладах:
let array = [1, 2, 3, "hello world", 4.12, true];
Це використання є дійсним у JavaScript. Масив з різними типами даних: рядок, числа та булеве значення.
Фрагмент ()
У зрізі () метод копіює задану частину масиву і повертає частину , яка скопійована в якості нового масиву. Це не змінює вихідний масив.
array.slice(from, until);
- Від: Нарізати масив, починаючи з індексу елемента
- До: Наріжте масив до індексу іншого елемента
Наприклад, я хочу нарізати перші три елементи з масиву вище. Оскільки перший елемент масиву завжди індексується з 0, я починаю нарізати “від” 0.
array.slice(0, until);
Тепер ось хитра частина. Коли я хочу , щоб нарізати перші три елементи, я повинен дати до параметра , як 3. метод зрізу () не включає в останній заданий елемент.
array[0] --> 1 // included array[1] --> 2 // included array[2] --> 3 // included array[3] --> "hello world" // not included
Це може створити певну плутанину. Ось чому я називаю другий параметр "до".
let newArray = array.slice(0, 3); // Return value is also an array
Нарешті, я призначаю нарізаний масив змінній newArray . Тепер давайте подивимось результат:


Зрощення ()
Назва цієї функції дуже схоже на slice () . Ця схожість імен часто бентежить розробників. Сплайсингу () Метод змінює масив, шляхом додавання або видалення елементів з неї. Давайте подивимося, як додавати та видаляти елементи за допомогою сплайсингу ( ) :
Видалення елементів
Для видалення елементів нам потрібно вказати параметр index та кількість елементів, які потрібно видалити:
array.splice(index, number of elements);
Індекс - це відправна точка для видалення елементів. Елементи, які мають менший номер індексу від даного індексу, не видаляються:
array.splice(2); // Every element starting from index 2, will be removed
Якщо ми не визначимо другий параметр, кожен елемент, починаючи з даного індексу, буде видалений з масиву:

Як другий приклад, я даю другий параметр як 1, тому елементи, починаючи з індексу 2, будуть видалятися по одному кожен раз, коли ми викликаємо метод splice () :
array.splice(2, 1);

Після першого дзвінка:

Після 2-го дзвінка:

Це може тривати до тих пір, поки індексу 2 більше не буде.
Додавання елементів
Для додавання елементів нам потрібно вказати їх як 3-й, 4-й, 5-й параметри (залежить від кількості доданих) до методу splice () :
array.splice (індекс, кількість елементів, елемент, елемент);
Як приклад, я додаю a і b на самому початку масиву і нічого не видаляю :
array.splice(0, 0, 'a', 'b');

Розділити ()
Методи Slice () та splice () призначені для масивів. Метод split () використовується для рядків . Він ділить рядок на підрядки і повертає їх як масив. Це займає 2 параметри, і обидва не є обов’язковими.
string.split(separator, limit);
- Розділювач: визначає, як розділити рядок ... комою, символом тощо.
- Обмеження: обмежує кількість поділів із заданим числом
Метод split () не працює безпосередньо для масивів . Однак спочатку ми можемо перетворити елементи нашого масиву у рядок, потім ми можемо використовувати метод split () .
Подивимось, як це працює.
По-перше, ми перетворюємо наш масив у рядок за допомогою методу toString () :
let myString = array.toString();

Тепер давайте розділимо MyString на коми, обмежити їх три підрядка, і повертає їх у вигляді масиву:
let newArray = myString.split(",", 3);

Як бачимо, myString розділяється комами. Оскільки ми обмежуємо розбиття на 3, повертаються лише перші 3 елементи.
ПРИМІТКА. Якщо у нас є таке використання:array.split("");
тоді кожен символ рядка буде розділений на підрядки:
Короткий зміст:
Фрагмент ()
- Копіює елементи з масиву
- Повертає їх як новий масив
- Не змінює вихідний масив
- Починає нарізання з… до заданого індексу: array.slice (з, до)
- Зріз не включає параметр індексу "до"
- Може використовуватися як для масивів, так і для рядків
Зрощення ()
- Використовується для додавання / видалення елементів з масиву
- Повертає масив видалених елементів
- Змінює масив
- Для додавання елементів: array.splice (індекс, кількість елементів, елемент)
- Для видалення елементів: array.splice (індекс, кількість елементів)
- Може використовуватися лише для масивів
Розділити ()
- Ділить рядок на підрядки
- Повертає їх у масиві
- Бере 2 параметри, обидва необов’язкові: string.split (роздільник, ліміт)
- Не змінює початковий рядок
- Може використовуватися лише для рядків
Існує багато інших вбудованих методів для масивів і рядків JavaScript, що полегшують роботу з програмуванням на JavaScript. Далі ви можете переглянути мою нову статтю про методи підрядків JavaScript.
Якщо ви хочете дізнатись більше про веб-розробку, сміливо стежте за мною на Youtube !
Дякую за читання!