JavaScript arrays can be retrieved or have elements removed using the functions slice and splice. They can occasionally be difficult to understand, but we'll be going over the procedures in depth to clear things up.
slice
Technically, the word "slice" implies to cut anything into pieces. It is employed to remove objects from an array. It has no impact on the initial array.
Syntax
array.slice(start, end)
The start index of the array's slicing is indicated by the variable start.
The index at which the array stops slicing is indicated by end.
Return value
An array of the values discovered between start and finish, except the value at end, is the value returned by the slice method.
If end is not supplied, the array's length will be applied. All values starting at the start index would therefore be returned.
Example
let arr = [
"codesolutionstuff",
4,
[1,3],
{type: "bird"}
];
let slicedValues = arr.slice(1,3);
console.log(arr);
console.log(slicedValues);
The starting index is 1 and the ending index is 3, as indicated in the syntax above.
The value at arr[1] is 4. The value at arr[3] is "type: bird." These two values are separated by the values [1,3]. As a result, the subarray [4, [1,3]] would be the value returned. Keep in mind that the value at the last index is disregarded.
However, arr continues to uphold its principles.
splice
The dictionary definition of "splice" is "to bind things together." It is used to add or take away elements from an array.
Syntax
removedArray = array.splice(index, count, item1......itemN)
Removed Array : The array which stores all the removed elements that the splice() method returns
Array: The array on which splice() method is being applied
Splice: Function call to the method
Index: Starting index for the splice() method
Count: Specifies the number of items in the array to replace/remove from the starting index
Items: Items that replace the array elements from the starting index
Return value
The values that are affected, or erased, are the ones that are returned. The array would be empty if deleteCount is 0.
let arr = [
"codesolutionstuff",
4,
[1,3],
{type: "bird"}
];
let returnedArr = arr.splice(2,1,{name: "codesolutionstuff"});
console.log(arr);
console.log(returnedArr);
The initial array, arr, is changed and becomes:
[
"codesolutionstuff",
4,
{name: "codesolutionstuff"},
{type: "bird"}
]
start
is 2
, deleteCount
is 1
, newElem1
is {name: "codesolutionstuff"}
. At arr[2]
, the value is [1,3]
. 1
item is deleted from the array which is [1,3]
. newElem1
is then added immediately after the start
. Since start
is removed, newElem
replaces it.
returnedArr
is [[1,3]]
, which contains the value that was affected.
Summary
Slice returns a portion of the array but has no impact on the entire array. Splice replaces, adds, or subtracts values from the original array and then returns the modified values.
You decide when to utilize each one. Slice is the method to use if all you want to do is get a subarray; splice is the method to use if you need to change the contents of the array.