This content originally appeared on DEV Community and was authored by Deepa Chaurasia
A lot of us often get confused between these methods .We end us googling every time we use them .I will try to make it pretty clear in your head .
So What's Slice??
Slice ==> copying the whole or a part of array.
Slice()- The slice() method copies a given part of an array and return that copied part as a new array.
So let's say you have a requirement where you don't want to alter your original array but perform some operations on it.
You'll use slice in this case , It will copy the exact array and then you can perform operations on those.
It doesn't change original array.
It copies the whole array or part of it acc to our requirement.
How to use it??
Syntax:
array.slice(from,untill)
From- Slice the array starting from specified index.
Until-Slice the array until another element index.
let fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
let citrus = fruits.slice(1, 3)
// citrus contains ['Orange','Lemon']
You can notice the slice () method doesn't include the last given element.
So here we have given index from 1 to 3 ,therefore
fruits[1]---> 'Orange' //included
fruits[2]---> 'Lemon' //included
fruits[3]---> 'Apple' //not included
Remember the end index elements are not included in slice().
We can also use it without parameters ,it will copy the whole array
let citrus=fruits.slice();
// citrus contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
Splice()
- It is used for adding/removing/replacing elements from array.
- It mutate/alter the array unlike slice().
How to use??
For removing elements,we need to give indes and no of elements to be removed.
Syntax:
array.splice(index,no of elements)
Index-starting point to remove.
let myFish = ['angel', 'clown', 'mandarin', 'sturgeon']
let removed = myFish.splice(2)
// myFish is ["angel", "clown"]
// removed is ["mandarin", "sturgeon"]
If you pass only one parameter ,it will remove all elements from starting index.
Inserting elements
`let myFish = ['angel', 'clown', 'mandarin', 'sturgeon']
let removed = myFish.splice(2, 0, 'drum')
// myFish is ["angel", "clown", "drum", "mandarin", "sturgeon"]
// removed is [], no elements removed`
Removing 0 elements
let myFish = ['angel', 'clown', 'mandarin', 'sturgeon']
let removed = myFish.splice(2, 0, 'drum', 'guitar')
// myFish is ["angel", "clown", "drum", "guitar", "mandarin", "sturgeon"]
// removed is [], no elements removed
Removing 1 element
let myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon']
let removed = myFish.splice(3, 1)
// myFish is ["angel", "clown", "drum", "sturgeon"]
// removed is ["mandarin"]
Replacing elements
let myFish = ['angel', 'clown', 'drum', 'sturgeon']
let removed = myFish.splice(2, 1, 'trumpet')
// myFish is ["angel", "clown", "trumpet", "sturgeon"]
// removed is ["drum"]
This content originally appeared on DEV Community and was authored by Deepa Chaurasia
Deepa Chaurasia | Sciencx (2022-06-14T05:25:41+00:00) Slice Vs Splice in Javascript. Retrieved from https://www.scien.cx/2022/06/14/slice-vs-splice-in-javascript/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.