Javascript-метод Array.slice: тонкощі використання

102 0 Новини високих технологій

Масиви в мові javascript мають безліч специфічних корисних методів, що полегшують маніпуляції з даними. Частина цих функцій модифікує вихідний об'єкт, інші - створюють змінені або точні копії. До останньої групи належить корисний метод Array.slice(). Він дозволяє виділити з масиву будь подмассив і використовувати його окремо.

Синтаксис методу



array.slice([begin[, end]])

Як видно, метод приймає два аргументи, але жоден з них не є обов'язковим.

Перший параметр позначає позицію початку шуканого подмассива, другий - позицію елемента, на якому буде припинено витяг. Отже, вони повинні представляти собою цілі числа.

При відсутності аргументу end метод буде працювати до самого кінця вихідного масиву.

При відсутності обох параметрів array - просто буде скопійовано повністю.

Функція може приймати і негативні аргументи, при цьому відлік позиції почнеться з кінця масиву.

Приклади роботи

Розглянемо роботу методу slice() на прикладі простого масиву чисел:

  let arr =[5, 4, 3, 2, 1];  

Отримання подмассива з перших трьох елементів:

  console.log(arr.slice(0 3));  

Тут перший аргумент - 0. Він вказує функції, що потрібно почати з нульової позиції. А другий - 3 говорить, що потрібно зупинитися на елементі з індексом 3 не включаючи його до фінальної вибірку. У підсумку на консоль буде виведений масив, що включає в себе 5 4 і 3.

<script async="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
<!-- fb_336x280_1 -->

<script> (adsbygoogle = window.adsbygoogle ||[]).push({});
[thumb]http://hi-news.pp.ua/uploads/posts/2018-06/javascript-metod-arrayslice-tonkosch-vikoristannya_181.jpeg[/thumb]

Отримання подмассива з останніх трьох елементів:

  console.log(arr.slice(-3));  

Для виконання цього завдання достатньо лише одного аргументу, який позначить початок вибірки. Від'ємне значення ініціює відлік з кінця масиву. У нашому випадку це елемент зі значенням 3. Підсумковий масив включає в себе числа 321.

Обчислене значення

Особливість методу javascript array.slice () полягає в тому, що він не модифікує об'єкт, у контексті якого був викликаний. Це означає, що після всіх проведених операцій масив arr залишився незмінним і може бути використаний програмою для інших цілей.

Робота функції полягає у створенні нового масиву, не пов'язаного з вихідним, і заповненні його вибраними елементами. Щоб цей масив можна було використовувати у подальшому, його необхідно записати в змінну.

<script async="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
<!-- fb_336x280_2 -->

<script> (adsbygoogle = window.adsbygoogle ||[]).push({});
  let arr =[5, 4, 3, 2, 1]; 
let newArr = arr.slice(1 4);

console.log(newArr); //[4, 3, 2]
console.log(arr); //[5, 4, 3, 2, 1]

З прикладу видно, що об'єкт arr залишився незміненим. Результат роботи методу став новий масив newArr .

[thumb]http://hi-news.pp.ua/uploads/posts/2018-06/javascript-metod-arrayslice-tonkosch-vikoristannya_292.jpeg[/thumb]

Копіювання масивів

Цей механізм дозволяє автоматично створювати копії, не перебираючи кожний елемент послідовності вручну.

  let clone = arr.slice(); 
console.log(clone); //[5, 4, 3, 2, 1]

Виклик методу без аргументів запускає копіювання з самого початку і до кінця масиву arr . Отриманий клон абсолютно незалежний від свого джерела і дозволяє маніпулювати даними без побоювання втратити їх назавжди.

  clone[2]++; 
console.log(clone); //[5, 4, 4, 2, 1]
console.log(arr); //[5, 4, 3, 2, 1]

Тут важливо пам'ятати, що об'єкти javascript передаються по посиланню. Отже, якщо елементи послідовності є об'єктами, то їх зміна в копії спричинить за собою таку ж зміну в исходнике.

  let arr =[
{a: 1},
[2, 3]
];

//копіюємо вихідний масив
let newArr = arr.slice();
console.log(newArr); //[{a: 1},[2, 3]]

//змінюємо копію
newArr[0].a = 7;
console.log(newArr); //[{a: 7},[2, 3]]

//вихідний масив теж змінився
console.log(arr); //[{a: 7},[2, 3]]


Без побоювань можна працювати з рядками, числами і булевими операторами значеннями, так як вони повністю копіюються у нову послідовність. При цьому додавання і видалення елементів в рамках клонованого масиву ніяк не впливає на вихідний.

Популярі новини
Загрузка...