Web/JavaScript/Reference/Global objects/Array/slice
The slice() method returns a shallow copy of a portion of an array into a new array object selected from start to end (end not included) where start and end represent the index of items in that array. The original array will not be modified.
The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone https://github.com/mdn/interactive-examples and send us a pull request.
Syntax
arr.slice([start[, end]])
Parameters
startOptional- Zero-based index at which to start extraction.
- A negative index can be used, indicating an offset from the end of the sequence.
slice(-2)extracts the last two elements in the sequence. - If
startis undefined,slicestarts from the index0. - If
startis greater than the index range of the sequence, an empty array is returned. endOptional- Zero-based index before which to end extraction.
sliceextracts up to but not includingend. For example,slice(1,4)extracts the second element through the fourth element (elements indexed 1, 2, and 3). - A negative index can be used, indicating an offset from the end of the sequence.
slice(2,-1)extracts the third element through the second-to-last element in the sequence. - If
endis omitted,sliceextracts through the end of the sequence (arr.length). - If
endis greater than the length of the sequence,sliceextracts through to the end of the sequence (arr.length).
Return value
A new array containing the extracted elements.
Description
slice does not alter the original array. It returns a shallow copy of elements from the original array. Elements of the original array are copied into the returned array as follows:
- For object
slicecopies object references into the new array. Both the original and new array refer to the same object. If a object changes, the changes are visible to both the new and original arrays. - For strings, numbers and booleans (not
String,NumberandBooleanobjects),slicecopies the values into the new array. Changes to the string, number, or boolean in one array do not affect the other array.
If a new element is added to either array, the other array is not affected.
Examples
Return a portion of an existing array
let fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
let citrus = fruits.slice(1, 3)
// fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
// citrus contains ['Orange','Lemon']
Using slice
In the following example, slice creates a new array, newCar, from myCar. Both include a reference to the object myHonda. When the color of myHonda is changed to purple, both arrays reflect the change.
// Using slice, create newCar from myCar.
let myHonda = { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } }
let myCar = [myHonda, 2, 'cherry condition', 'purchased 1997']
let newCar = myCar.slice(0, 2)
// Display the values of myCar, newCar, and the color of myHonda
// referenced from both arrays.
console.log('myCar = ' + JSON.stringify(myCar))
console.log('newCar = ' + JSON.stringify(newCar))
console.log('myCar[0].color = ' + myCar[0].color)
console.log('newCar[0].color = ' + newCar[0].color)
// Change the color of myHonda.
myHonda.color = 'purple'
console.log('The new color of my Honda is ' + myHonda.color)
// Display the color of myHonda referenced from both arrays.
console.log('myCar[0].color = ' + myCar[0].color)
console.log('newCar[0].color = ' + newCar[0].color)
This script writes:
myCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2,
'cherry condition', 'purchased 1997']
newCar = [{color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}}, 2]
myCar[0].color = red
newCar[0].color = red
The new color of my Honda is purple
myCar[0].color = purple
newCar[0].color = purple
Array-like objects
slice method can also be called to convert Array-like objects/collections to a new Array. You just bind the method to the object. The arguments inside a function is an example of an 'array-like object'.
function list() {
return Array.prototype.slice.call(arguments)
}
let list1 = list(1, 2, 3) // [1, 2, 3]
Binding can be done with the call() method of Function.prototype and it can also be reduced using [].slice.call(arguments) instead of Array.prototype.slice.call.
Anyway, it can be simplified using bind.
let unboundSlice = Array.prototype.slice
let slice = Function.prototype.call.bind(unboundSlice)
function list() {
return slice(arguments)
}
let list1 = list(1, 2, 3) // [1, 2, 3]
Specifications
| Specification |
|---|
| ECMAScript (ECMA-262)The definition of 'Array.prototype.slice' in that specification. |
Browser compatibility
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
| Desktop | Mobile | Server | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
slice
|
Chrome
Full support 1 |
Edge
Full support 12 |
Firefox
Full support 1 |
IE
Full support 4 |
Opera
Full support 4 |
Safari
Full support 1 |
WebView Android
Full support 1 |
Chrome Android
Full support 18 |
Firefox Android
Full support 4 |
Opera Android
Full support 10.1 |
Safari iOS
Full support 1 |
Samsung Internet Android
Full support 1.0 |
nodejs
Full support 0.1.100 |
Legend
- Full support
- Full support
See also
Array.prototype.slice() by Mozilla Contributors is licensed under CC-BY-SA 2.5.