JavaScript slice: Method Explained with Examples

While working with JavaScript arrays, you may sometimes need to extract a specific part of an array. That’s the place where the JavaScript slice method comes in. The slice method in JavaScript allows users and developers to get a small part from an array without changing the original array. In this blog, you will learn everything about the slice method in JavaScript, including syntax and return value, and the common use cases of the slice method in JavaScript.

Table of Contents:

• JavaScript Array
• Slice Method in JavaScript
  • Syntax
  • Parameters
  • Return Value
• JavaScript slice() Method Examples
  • Example 1: Using slice() with no arguments
  • Example 2: Only passing the value of startIndex
  • Example 3: Using slice with negative indexes
  • Example 4: Using slice() method with nested arrays
• Common Use Cases
• Browser Compatibility
• Conclusion

JavaScript Array

In JavaScript, an array is defined as a special type of variable that can hold more than one value at a time, which means you don’t need to create separate variables for each and every item of JavaScript array, you can store all the values in a single variable by declaring it as an array.

Syntax:

let learner = ["L1", "L2", "L3", "L4", "L5"];

Slice Method in JavaScript

The slice method in JavaScript is defined as a non-destructive method that is used to get a specific part of an array in the form of a new array. It will allow the users to choose where to start and where to stop.

Syntax

array.slice(startIndex, endIndex);

Parameters

The slice method in JavaScript is a very important method that is used with JavaScript arrays. It has two parameters, one is startIndex and the other is endIndex. Let’s understand each parameter one by one:

• startIndex: This is the first parameter, which tells the position where the slice starts. It tells JavaScript that from which item in the array to begin with.
• endIndex: This is the second parameter, which tells the position where the slice stops. One important point is that the output array doesn’t contain the element present at this position.

Design and Build Responsive Websites

Start Today

Explore Program

Return Value

The slice method in JavaScript is a non-destructive method, which means it doesn’t change the original array. Instead of doing this, it gives you a new array that contains the items that are selected by you.

Example: Extracting values between two indices.

Output:

Explanation: In this example, the slice method in JavaScript is used to get some selected values from the original array. The output array (result) is a new array, and the original learner array stays the same.

JavaScript slice() Method Examples

Here are some more examples that help you to understand more about the JavaScript slice in detail:

Example 1: Using slice() with no arguments

If you use the slice method in JavaScript without passing any start or end parameters, then it will return a copy of the entire array.

Output:

Example 2: Only passing the value of startIndex

If you give only one parameter (startIndex) to the slice method in JavaScript, then it will start from that index and go to the end.

Output:

Example 3: Using slice with negative indexes

The negative indexes are also supported by the slice method in JavaScript. When you pass the negative index, it starts the counting from the end of the array instead of starting from the beginning.

Output:

Example 4: Using slice() method with nested arrays

You can also use the slice method in JavaScript on a nested array (meaning an array inside another array).

Output:

Common Use Cases

The slice method in JavaScript is one of the important methods that is used while working with arrays in JavaScript. Here is the list of some important use cases of the JavaScript slice method:

• The JavaScript slice Method allows you to create a shallow copy of an array without changing the original array.
• You can use the slice method in JavaScript to get some selected items from the original array.
• You can also use the slice method with the strings in JavaScript. Doing the string slicing in JavaScript doesn’t change the original string.
• In real-world projects, the slice method in JavaScript helps in Pagination (showing items on some pages).

Browser Compatibility

The slice method in JavaScript is completely supported by all the major browsers. Thus, you don’t need to worry about this. Here is the list of all the common browsers:

• Google Chrome
• Mozilla Firefox
• Microsoft Edge
• Safari
• Opera

Conclusion

The slice method in JavaScript is a simple and important method used with JavaScript arrays and helps you to get selected items from the original array. Whether you need to copy an array or extract specific values, the JavaScript slice method is a great choice. The JavaScript slice method doesn’t change the original array in which you’re working. Understanding this slice method in JavaScript helps users in various real-world applications.

Looking to prepare for your next tech interview? Check out our comprehensive list of JavaScript Interview Questions to boost your confidence.

JavaScript Array slice() Method – FAQs