Array.prototype.slice()

Метод slice() (вирізати скибку, зріз) примірників Array повертає поверхневу копію (зріз) певної частини масиву, взяту від елемента за індексом start (включно) до елемента за індексом end (не включно), у вигляді нового масиву. Початковий масив не змінюється.

Спробуйте його в дії

Синтаксис

slice()
slice(start)
slice(start, end)

Параметри

start (початок) Необов'язкове

Індекс (починаючи з нуля), за яким почнеться вибирання елементів з масиву, перетворений на ціле число.

  • Від'ємний індекс рахується з кінця масиву: якщо start < 0, використовується start + array.length.
  • Якщо start < -array.length або start опущено, використовується 0.
  • Якщо start >= array.length, то нічого не вибирається.
end (кінець) Необов'язкове

Індекс (починаючи з нуля), на якому припиниться вибирання елементів з масиву, перетворений на ціле число. slice() вибирає елементи до, але не включаючи end.

  • Від'ємний індекс рахується з кінця масиву: якщо end < 0, використовується end + array.length.
  • Якщо end < -array.length, використовується 0.
  • Якщо end >= array.length або end опущено, використовується array.length, унаслідок чого вибираються всі елементи аж до кінця масиву.
  • Якщо end розташований перед або на start після нормалізації, то нічого не вибирається.

Результат

Новий масив, що містить всі витягнуті елементи.

Опис

Метод slice() є копіювальним методом. Він не змінює this, а повертає поверхневу копію, котра містить частину тих самих елементів, що є у вихідному масиві.

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

Метод slice() є узагальненим. Він лишень очікує, що значення this матиме властивість length, а також властивості з цілочисловими ключами.

Приклади

Повернення частини наявного масиву

const fruits = ["Банан", "Апельсин", "Лимон", "Яблуко", "Манго"];
const citrus = fruits.slice(1, 3);

// fruits містить ['Банан', 'Апельсин', 'Лимон', 'Яблуко', 'Манго']
// citrus містить ['Апельсин','Лимон']

Застосування функції slice

В цьому прикладі slice створює новий масив newCar з myCar. Обидва містять посилання на об'єкт myHonda. Коли колір myHonda змінюється на purple, обидва масиви показують цю зміну.

// За допомогою slice() створити newCar з myCar.
const myHonda = {
  color: "червоний",
  wheels: 4,
  engine: { cylinders: 4, size: 2.2 },
};
const myCar = [myHonda, 2, "чудовий стан", "придбана у 1997"];
const newCar = myCar.slice(0, 2);

console.log("myCar =", myCar);
console.log("newCar =", newCar);
console.log("myCar[0].color =", myCar[0].color);
console.log("newCar[0].color =", newCar[0].color);

// Змінити колір myHonda.
myHonda.color = "бузковий";
console.log("Новий колір моєї Honda –", myHonda.color);

console.log("myCar[0].color =", myCar[0].color);
console.log("newCar[0].color =", newCar[0].color);

Скрипт надрукує такий текст:

myCar = [
  {color: 'червоний', wheels: 4, engine: {cylinders: 4, size: 2.2 } },
  2,
  'чудовий стан','придбана у 1997'
]
newCar = [ { color: 'червоний', wheels: 4, engine: { cylinders: 4, size: 2.2 } }, 2 ]
myCar[0].color = червоний
newCar[0].color = червоний
Новий колір моєї Honda – бузковий
myCar[0].color = бузковий
newCar[0].color = бузковий

Виклик slice() на об'єктах-немасивах

Метод slice() зчитує з this властивість length. Потім він зчитує цілочислові властивості від start до end і визначає їх на новоствореному масиві.

const arrayLike = {
  length: 3,
  0: 2,
  1: 3,
  2: 4,
  3: 33, // ігнорується slice(), оскільки length – 3
};
console.log(Array.prototype.slice.call(arrayLike, 1, 3));
// [ 3, 4 ]

Використання slice() для перетворення масивоподібних об'єктів на масиви

Метод slice() нерідко використовується вкупі з bind() і call() для створення допоміжного методу, що перетворює масивоподібний об'єкт на масив.

// slice() викликається з `this`, переданим як перший аргумент
const slice = Function.prototype.call.bind(Array.prototype.slice);

function list() {
  return slice(arguments);
}

const list1 = list(1, 2, 3); // [1, 2, 3]

Використання slice() на розріджених масивах

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

console.log([1, 2, , 4, 5].slice(1, 4)); // [2, порожньо, 4]

Специфікації

Сумісність із браузерами

desktop mobile server
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on iOS Samsung Internet Deno Node.js
slice
Chrome Full support 1
Edge Full support 12
Firefox Full support 1
Internet Explorer Full support 4
Opera Full support 4
Safari Full support 1
WebView Android Full support 1
Chrome Android Full support 18
Firefox for Android Full support 4
Opera Android Full support 10.1
Safari on iOS Full support 1
Samsung Internet Full support 1.0
Deno Full support 1.0
Node.js Full support 0.10.0

Дивіться також