This content originally appeared on DEV Community 👩💻👨💻 and was authored by Kuldeep Singh
JavaScript’s Array slice() method returns a copy of array as new array, For returning the new array it accepts parameters which are optional as well, start which is inclusive and an end which is exclusive which means if you have passed 1 as start(index) and 3 as end(index) then slice will return a new copy of your given array which will contain two values(indexes). The slice() method does not change the original array. end is treated as end-1 internally in slice() method of array.
EXAMPLE
const cars = ['Toyota', 'Volkswagen','Daimler','Ford Motor','Honda','BMW','Hyundai','Nisaan','Renault','Kia'];
// no value
console.log(cars.slice());
// expected output: [ 'Toyota', 'Volkswagen', 'Daimler', 'Ford Motor', 'Honda', 'BMW', 'Hyundai', 'Nisaan', 'Renault', 'Kia' ]
// single index
console.log(cars.slice(4));
// expected output: [ 'Honda', 'BMW', 'Hyundai', 'Nisaan', 'Renault', 'Kia' ]
// from middle index
console.log(cars.slice(4,7));
// expected output: [ 'Honda', 'BMW', 'Hyundai' ]
// from beginning of the index
console.log(cars.slice(0,4));
// expected output: [ 'Toyota', 'Volkswagen', 'Daimler', 'Ford Motor' ]
// negative index
console.log(cars.slice(-4));
// expected output: [ 'Hyundai', 'Nisaan', 'Renault', 'Kia' ]
// from index 6 to -3(excluded)
console.log(cars.slice(4,-1));
// expected output: [ 'Honda', 'BMW', 'Hyundai', 'Nisaan', 'Renault' ]
JavaScript Array.Prototype.slice() Syntax
slice()
slice(start)
slice(start, end)
As you can see you can use slice() method in multiple ways it depends on you how you want to use because as you have seen in above code you can use negative indexes as well to access the values of array to create your own new array as of needed.
JavaScript Array.Prototype.slice() Parameters
start (optional)
Zero-based index at which to start extraction.
Negative index can be used, and it selects from the end of the array. slice(-3) extracts the last three elements in the sequance.
If start is omitted or undefined, slice starts from the index 0.
if start is greater than the length of the sequence(array), an empty array will return.
end (optional)
The index of the first element to exclude from the returned array. slice extracts up to but not including end which means end-1.
A negative index can be used, indicating an offset from the end of the sequence.
If end is omitted or undefined, slice extracts through the end of the sequence array.length.
If end is greater than the length of the sequence, slice extracts through to the end of the sequence array.length.
Return value of slice() function
Array method slice() returns a new array containing the extracted elements based on provided parameters.
JavaScript slice() method
const cars = ['Toyota', 'Volkswagen', 'Daimler', 'Ford Motor', 'Honda', 'BMW', 'Hyundai', 'Nisaan', 'Renault', 'Kia'];
// slicing the hole array from starting to end
let ncars = cars.slice();
console.log(ncars);
// [ 'Toyota', 'Volkswagen', 'Daimler', 'Ford Motor', 'Honda', 'BMW', 'Hyundai', 'Nisaan', 'Renault', 'Kia' ]
// slicing from the middle of the array
let middleIndex = Math.floor(cars.length / 2);
let middleArr = cars.slice(middleIndex);
console.log(middleArr);
// [ 'BMW', 'Hyundai', 'Nisaan', 'Renault', 'Kia' ]
// slicing from the second element to second last element
let second = 1;
let secondLast = cars.length - 1;
let almostFull = cars.slice(second, secondLast);
console.log(almostFull);
// [ 'Volkswagen', 'Daimler', 'Ford Motor', 'Honda', 'BMW', 'Hyundai', 'Nisaan', 'Renault' ]
Output:
[ ‘Toyota’, ‘Volkswagen’, ‘Daimler’, ‘Ford Motor’, ‘Honda’, ‘BMW’, ‘Hyundai’, ‘Nisaan’, ‘Renault’, ‘Kia’ ]
[ ‘BMW’, ‘Hyundai’, ‘Nisaan’, ‘Renault’, ‘Kia’ ]
[ ‘Volkswagen’, ‘Daimler’, ‘Ford Motor’, ‘Honda’, ‘BMW’, ‘Hyundai’, ‘Nisaan’, ‘Renault’ ]
JavaScript slice() Negative Index
In JavaScript slice() method, you can use negative index for start and end parameters. The index of the last element is -1, and the index of second last element is -2, and so on.
const cars = ['Toyota', 'Volkswagen', 'Daimler', 'Ford Motor', 'Honda', 'BMW', 'Hyundai', 'Nisaan', 'Renault', 'Kia'];
// slicing the array from second-to-last
let narr = cars.slice(1,-1);
console.log(narr);
// [ 'Volkswagen', 'Daimler', 'Ford Motor', 'Honda', 'BMW', 'Hyundai', 'Nisaan', 'Renault' ]
// slicing array from from last four
let lastfour = cars.slice(-4);
console.log(lastfour);
// [ 'Hyundai', 'Nisaan', 'Renault', 'Kia' ]
// both negative indexes
let bothNegative = cars.slice(-5,-2);
console.log(bothNegative);
// [ 'BMW', 'Hyundai', 'Nisaan' ]
Output:
[ ‘Volkswagen’, ‘Daimler’, ‘Ford Motor’, ‘Honda’, ‘BMW’, ‘Hyundai’, ‘Nisaan’, ‘Renault’ ]
[ ‘Hyundai’, ‘Nisaan’, ‘Renault’, ‘Kia’ ]
[ ‘BMW’, ‘Hyundai’, ‘Nisaan’ ]
This article is originally posted on programmingeeksclub.com
My Personal Blogging Website : Programming Geeks Club
My Facebook Page : Programming Geeks Club
My Telegram Channel : Programming Geeks Club
My Twitter Account : Kuldeep Singh
This content originally appeared on DEV Community 👩💻👨💻 and was authored by Kuldeep Singh
Kuldeep Singh | Sciencx (2022-11-02T13:43:19+00:00) Array.Prototype.slice() Method Explained JavaScript. Retrieved from https://www.scien.cx/2022/11/02/array-prototype-slice-method-explained-javascript/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.