JavaScript Array slice() Method

JavaScript Array slice() method is used to extract a portion of the original array into a new array object. It doesn’t modify the original array. 

Syntax

array.slice(start, end)

Parameters

  1. start(optional): It is the index at which to begin extraction. If not provided, the selection starts at start 0.
  2. end(optional): It is the index before which to end extraction(not including end). If negative, it’s treated as an offset from the end.

Return Value

Returns a new array containing the extracted elements.

Visual RepresentationVisual Representation of JavaScript Array slice() Method

Example 1: How to use Array slice() method

let letters = ['A', 'B', 'C','D', 'E', 'F'];

//Starts slicing from the third element (index 2) until the end of the array.
let slicedPortion = letters.slice(2);

console.log(slicedPortion);

//Starts slicing from the first element (index 0) and stops right before the fourth element (index 3).
let slicedPortion2 = letters.slice(0, 3);

console.log(slicedPortion2);

Output

[ 'C', 'D', 'E', 'F' ]
[ 'A', 'B', 'C' ]

One question in your mind is how this keyword in the .slice() functions as an Array. Because when you do.

object.method()

The object automatically refers to the value of this keyword in the javascript method. So with:

[1,2,4,5].slice()

Example 2: Using on array-like objects

function list() {
 let argsArr = Array.prototype.slice.call(arguments);
 let slicedArg = argsArr.slice(1, 4);
 return slicedArg;
 }
 
 const list1 = list(1,2,3,4,5);
 console.log(list1);

Output

[ 2, 3, 4 ]

Example 3: Passing negative parametersVisual Representation of Passing negative parameters

let arr = ['first', 'second', 'third', 'fourth', 'fifth'];

let newArr = arr.slice(-4, -1);

console.log(newArr);

Output

[ 'second', 'third', 'fourth' ]

In the above example, Starts slicing from the second element (-4)  and stops right before the last element (or -1).

Example 4: Using sparse arrays

console.log([1, 2, , 4, 5].slice(1, 4));

Output

[ 2, <1 empty item>, 4 ]

Example 5: Clone an array

let numbers = [11, 21, 31, 41, 51];

let newNumbers = numbers.slice();

console.log(newNumbers)

Output

[ 11, 21, 31, 41, 51 ]

Browser Compatibility

  1. Google Chrome 1 and above
  2. Microsoft Edge 12 
  3. Firefox 1 and above
  4. Safari 1 and above
  5. Opera 4 and above

2 thoughts on “JavaScript Array slice() Method”

  1. I like your tutorials!

    But as someone who is only learning js, i’d like to point out that in this case is good to explain why the result is what it is.
    let namepartner = [‘Pearson’, ‘Specter’, ‘Litt’];
    let suits = namepartner.slice(1, 2);

    console.log(suits);
    Specter

    slice method with parameters 1 and 2 starts at 1 and end at 2(2 not included).
    so as arrays start count as 0, Pearson is ignored, Spencer with position 1 is the result and Litt with position 2 is also ignored.

    also maybe better example would be bigger array.

    Reply

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.