Introduction
Array slicing is a common operation in JavaScript that is used to extract a section of an array and return it as a new array. This is often done to access or manipulate a specific subset of the elements in an array, or to split an array into smaller arrays for further processing.
In this article, we will discuss different approaches we can use to perform array slicing operations.
Method-1: Use the slice method for array slicing
The most basic approach to array slicing in JavaScript is to use the slice method, which is a built-in method of the Array prototype. The slice method accepts two arguments: the starting index of the slice (inclusive), and the ending index of the slice (exclusive). Here is an example of how to use the "slice" method to extract a section of an array:
let myArray = [1, 2, 3, 4, 5];
let slicedArray = myArray.slice(1, 3);
console.log(slicedArray);
Output
[ 2, 3 ]
In this example, the slice method is called on the myArray array, and it is passed two arguments: "1" and "3". This extracts the elements of the array with indexes 1 and 2 (i.e. the second and third elements of the array), and it returns a new array containing these elements. The result is then assigned to the slicedArray variable, and it is logged to the console.
Method-2: Use the splice method for array slicing
In addition to the slice method, there are several other approaches to array slicing in JavaScript that you can use. For example, you can use the splice method, which is similar to the slice method but also allows you to remove elements from the original array. Here is an example of how to use the splice method for array slicing:
let myArray = [1, 2, 3, 4, 5];
let slicedArray = myArray.splice(1, 3);
console.log(slicedArray);
console.log(myArray);
Output
[ 2, 3, 4 ]
[ 1, 5 ]
In this example, the "splice" method is called on the myArray array, and it is passed two arguments: "1" and "3". This extracts the elements of the array with indexes 1, 2, and 3 (i.e. the second, third, and fourth elements of the array), and it removes these elements from the original array. The result is then assigned to the slicedArray variable, and the modified myArray array is logged to the console.
Method-3: Use the subarray method for array slicing
Another approach to array slicing in JavaScript is to use the subarray method, which is a new method introduced in the ECMAScript 2015 (ES6) standard. This method is similar to the slice method, but it returns a new TypedArray object instead of a regular JavaScript array. Here is an example of how to use the subarray method for array slicing:
const myArray = new Uint8Array([10, 20, 30, 40, 50]);
let slicedArray = myArray.subarray(1, 4);
console.log(slicedArray);
Output
Uint8Array(3) [ 20, 30, 40 ]
In this example, the subarray method is called on the myArray array, and it is passed two arguments: "1" and "4". This extracts the elements of the array with indexes 1, 2 and 3 (i.e. the second, third and fourth elements of the array), and it returns a new TypedArray object containing these elements. The result is then assigned to the slicedArray variable, and it is logged to the console.
Method-4: Use the filter method for array slicing
In addition to the slice, splice, and subarray methods, there are several other approaches that you can use for array slicing in JavaScript.
For example, you can use the filter method, which is a built-in method of the Array prototype that allows you to create a new array by filtering the elements of an existing array based on a specified condition. Here is an example of how to use the filter method for array slicing:
let myArray = [1, 2, 3, 4, 5];
let slicedArray = myArray.filter(function (element, index) {
if (index >= 1 && index < 3) {
return element;
}
});
console.log(slicedArray);
In this example, the filter method is called on the myArray array, and it is passed a callback function as its argument. This callback function is executed for each element in the array, and it returns true if the element's index is greater than or equal to 1 and less than 3, and false otherwise. This filters the elements of the array to include only the elements with indexes 1 and 2, and it returns a new array containing these elements. The result is then assigned to the slicedArray variable, and it is logged to the console.
Summary
There are several approaches that you can use for array slicing in JavaScript. From the slice, splice, subarray to the filter method, these approaches allow you to create a new array by filtering or transforming the elements of an existing array. These methods are useful for accessing and manipulating specific subsets of the elements in an array, and they provide additional flexibility and power for working with arrays in JavaScript.
References
Array.prototype.slice() - JavaScript | MDN (mozilla.org)
Array.prototype.splice() - JavaScript | MDN (mozilla.org)
TypedArray.prototype.subarray() - JavaScript | MDN (mozilla.org)
Array.prototype.filter() - JavaScript | MDN (mozilla.org)
