JavaScript

Javascript slice() Method

1. Introduction

This is an in-depth article related to the Javascript slice method. The slice method is used for getting a subset of elements in the array.

2. Javascript slice()

The slice() method on the array returns a new array having a part of the array. The actual array does not change.

2.1 Prerequisites

A browser that supports javascript is needed to run this example.

2.2 Download

You can download any browser which supports javascript. The browsers that support the JavaScript Array slice() method are mentioned below:

  • Google Chrome 1 above
  • Edge 12 and above
  • Firefox 1 and above
  • Internet Explorer 4 and above
  • Opera 4 and above
  • Safari 1 and above

2.3 What is javascript slice()?

slice method on the array takes parameters such as begin and end. The default value for begin is 0 and the end is the end of the array. This method returns a part of the actual array. You can see the example below for the usage.

Slice method example

function sliceExample() {
  
    var array = [1,2,3,4,5];
    var new_array = array.slice(2,4);
    document.write(array);
    document.write("
"); document.write(new_array); } sliceExample();

You can open the HTML page to see the output in the browser. Output is shown below:

Output

[1,2,3,4,5]
[3,4]

2.4 Syntax of javascript slice()

The syntax of the slice() method on an array is slice(start, end). Defaults for start is 0 and end is the last element index. The method returns the elements starting from the start (inclusive) and ending at the end (exclusive).

2.5 Simple Example

Let us look at an example where the slice method can be used for an array of objects.

Example for slice usage with array of objects

let person = {
  name: "Thomas Smith",
  age: 31,
};

let array_persons = [person, "Bill Clay", "Will Smith"];

console.log(array_persons[0]); 

let new_array = array_persons.slice();





new_array[0].name = "Andrew Smith";

console.log(array_persons[0]);

You can execute the code above in a browser that supports javascript. The output in the browser console will be as below:

Output

{ name: 'Thomas Smith', age: 31 }
{ name: 'Andrew Smith', age: 31 }

2.6 JavaScript slice() With Negative index

Now let us look at the slice method with the start parameter value negative. The last element is -1 and -2 will be the second last element. You can see the code below demonstrating the example.

Example for slice with Negative Index

const books = ["War and Peace", "Only Paranoid can Survive","Health Care Technology","Pride and Prejudice"];

let new_array = books.slice(0, -1);
console.log(new_array); 

let new_array1 = books.slice(-3);
console.log(new_array1); 

You can execute the code above in a browser that supports javascript. The output in the browser console will be as below:

Example for slice with Negative Index

["War and Peace", "Only Paranoid can Survive","Health Care Technology"]
["Only Paranoid can Survive","Health Care Technology","Pride and Prejudice"]

3. Download the Source Code

Download
You can download the full source code of this example here: Javascript slice() Method

Bhagvan Kommadi

Bhagvan Kommadi is the Founder of Architect Corner & has around 20 years’ experience in the industry, ranging from large scale enterprise development to helping incubate software product start-ups. He has done Masters in Industrial Systems Engineering at Georgia Institute of Technology (1997) and Bachelors in Aerospace Engineering from Indian Institute of Technology, Madras (1993). He is member of IFX forum,Oracle JCP and participant in Java Community Process. He founded Quantica Computacao, the first quantum computing startup in India. Markets and Markets have positioned Quantica Computacao in ‘Emerging Companies’ section of Quantum Computing quadrants. Bhagvan has engineered and developed simulators and tools in the area of quantum technology using IBM Q, Microsoft Q# and Google QScript. He has reviewed the Manning book titled : "Machine Learning with TensorFlow”. He is also the author of Packt Publishing book - "Hands-On Data Structures and Algorithms with Go".He is member of IFX forum,Oracle JCP and participant in Java Community Process. He is member of the MIT Technology Review Global Panel.
Subscribe
Notify of
guest

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

0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Back to top button