JavaScript - Array slice() Method

Previous
Quiz

In JavaScript, the Array.slice() method is used to select a portion of elements from an array and return a new array with those selected elements. It accepts two parameters: "start" index and the "end" index. It selects from a given "start", up to a given "end". If we do not provide the end index, the method extracts to the end of the array.

This method does not modify the existing array instead; it returns a new array containing the shallow copy of the selected elements.

Syntax

Following is the syntax of JavaScript Array slice() method −

 array.slice(start, end);

Parameters

This method accepts two parameters. The same is described below −

  • start − This is the start position in the array from which we want to select elements. By default, this value is 0.
  • end − This is the position in the array before which we want to stop selecting elements. Default value is the last element.

Return value

This method returns a new array containing the extracted elements. It does not modify the original array.

Examples

Example 1

In the following example, we are passing "2" as the start index to the JavaScript Array slice() method.

 <html> <body> <p id="demo"></p> <script> const animals = ["Lion", "Cheetah", "Tiger", "Elephant", "Dinosaur"]; let result = animals.slice(2); document.getElementById("demo").innerHTML = result; </script> </body> </html>

After executing the above program, the slice() method selects and returns all the elements from index position 2 to the end of the array.

Output

 Tiger,Elephant,Dinosaur

Example 2

Here, we are selecting and returning the elements from the element at index 2 till the element at index 4 −

 <html> <body> <p id="demo"></p> <script> const animals = ["Lion", "Cheetah", "Tiger", "Elephant", "Dinosaur"]; let result = animals.slice(2, 4); document.getElementById("demo").innerHTML = result; </script> </body> </html>

Output

 Tiger,Elephant

Example 3

Here, we are passing a negative value -2 as an argument to the start index of slice() method. So, the method starts selecting the elements from the end of the array.

 <html> <body> <p id="demo"></p> <script> const animals = ["Lion", "Cheetah", "Tiger", "Elephant", "Dinosaur"]; let result = animals.slice(-2); document.getElementById("demo").innerHTML = result; </script> </body> </html>

Output

 Elephant,Dinosaur

Example 4

In this example, we are passing -4 as start postion and −1 as end position. So, it selects and returns elements from the fourth-to-last to the second-to-last in the array.

 <html> <body> <p id="demo"></p> <script> const animals = ["Lion", "Cheetah", "Tiger", "Elephant", "Dinosaur"]; let result = animals.slice(-4, -1); document.getElementById("demo").innerHTML = result; </script> </body> </html>

Output

 Cheetah,Tiger,Elephant

Example 5

If no arguments are passed, the slice() method returns the result array contains the same elements as the original animals array.

 <html> <body> <p id="demo"></p> <script> const animals = ["Lion", "Cheetah", "Tiger", "Elephant", "Dinosaur"]; let result = animals.slice(); document.getElementById("demo").innerHTML = result; </script> </body> </html>

Output

As we can see the output, result array contains same elements as animals array.

 Lion,Cheetah,Tiger,Elephant,Dinosaur
Print Page
Previous
Next
Advertisements