Cheat Sheet for Array methods in JS

Array methods in Javascript

Arrays are widely used in our projects either it may be on front-end development or back-end development. In general, an array is a collection of items stored at contiguous memory location. There are multiple methods which are in-built and very useful while handling the arrays. Most of the people show them but cannot memorize on spot. So, this blog is an attempt to understand these methods. Let's discuss these methods one-by-one:

let myArray = [2];

Push and Unshift
push() method will add a new element at the end of the array and unshift() will add a new element at the start of the array. These both methods will return a new array with added elements

myArray.push(3.14);
console.log(myArray)   //[2, 3.14]
myArray.push(true);
console.log(myArray)   //[2, 3.14, true]
myArray.unshift('a');
console.log(myArray)   //['a', 2, 3.14, true]

Pop and Shift
pop() method will remove the last element of the array and shift() will remove the first element of the array. These both methods will return a new array after removing respective elements.

myArray.pop();
console.log(myArray)   //['a', 2, 3.14]
myArray.shift();
console.log(myArray)   //[2, 3.14]

We can delete the elements in an array using the ‘delete’ command. The drawback using delete is that it leaves undefined value at the index we deleted from the array.

let arr = [1,2,3,4]; 
delete arr[2];
console.log(arr)   //[1,2,undefined,3]

To overcome this problem we use splice method on arrays.

Splicing of an Array:

Splice method can be used to add an element, delete an element, replace an element from an array. Let’s look into how the splice() method works. In general splice() function accepts 2 parameters. The first one represents the target index of the array and the second parameter represents the count of elements we want to delete after that particular target index. For example.

let arr = [1,2,3,4]; 
arr.splice(start index, delete count);
start index - Index from which the splice action is to be perfomred.
delete count - number of items to be removed starting from the start index.

If we want to add an element at a particular index, the delete count will be 0. For example,

let arr = [1,2,3,4]; 
arr.splice(2,0,'f');
console.log(arr)  //[1,2,'f',3,4]

Here the start index is 2, so the splice action is taking place at 2. Delete count is 0, so no element is getting deleted. The third parameter is the element which is to be added at the target index. Hence, ‘f’ is added at the index 2 of the array.

Similarly, if we want to delete elements, we mention the start index and the delete count of how many items to be deleted from that index. For example,

let arr = [1,2,3,4]; 
arr.splice(2,2);
console.log(arr)  //[1,2]

Here the start index is 2, so the splice action is taking place at 2. Delete count is 2, so 2 element is getting deleted starting from the index 2.

We can also replace elements using splice method. Here the first parameter will be the start index, second parameter will be the delete count and the rest paraments will be added from the start index.

let arr = [1,2,3,4]; 
arr.splice(2, 1, 'a', 'b');
console.log(arr)  //[1, 2, 'a', 'b', 4]

Here the start index is 2, so the splice action is taking place at 2. Delete count is 1, so 1 element is getting deleted starting from the index 2 (which is 3). The rest of the parameters are ‘a’, ‘b’. There are getting added in the array from the start index.

findIndex() method:
This method returns the index of the first item that satisfies the provided testing function. If no element in the array satisfies the condition of the testing function, it returns -1.

Conclusion
These are the basic operations that can be performed on arrays. Along with these, there are a lot more methods are present which helps us in easing the operations on arrays.