JS Array Methods

 

1. Array Methods

MethodFunctionality
includes, indexOf, lastIndexOf, find, findIndex()Finding Elements
push, unshift, spliceAdding Elements
pop, shift, spliceRemoving Elements
concat, sliceCombining & Slicing Arrays
joinJoining Array Elements
sortSorting Array Elements

1.1 splice()

The

splice()
method changes the contents of an array.

Using

splice()
method, we can

  • Remove existing items
  • Replace existing items
  • Add new items

1.1.1 Removing existing items

Syntax:

arr.splice(Start, Delete Count)

  • Start: Starting Index
  • Delete Count: Number of items to be removed, starting from the given index
let myArray = [5, "six", 2, 8.2];
myArray.splice(2, 2);
console.log(myArray); // [5, "six"]
let deletedItems = myArray.splice(2, 2);
console.log(deletedItems); // [2, 8.2]
JAVASCRIPT

The

splice()
method returns an array containing the deleted items.

1.1.2 Adding new items

Syntax:

arr.splice(Start, Delete Count, Item1, Item2 ... )

Here the

Item1, Item2 ...
are the items to be added, starting from the given index.

let myArray = [5, "six", 2, 8.2];
myArray.splice(2, 0, "one", false);
console.log(myArray); // [5, "six", "one", false, 2, 8.2]
JAVASCRIPT

1.1.3 Replacing existing items

Syntax:

arr.splice(Start, Delete Count, Item1, Item2 ... )

let myArray = [5, "six", 2, 8.2];
myArray.splice(2, 1, true);
console.log(myArray); // [5, "six", true, 8.2]
JAVASCRIPT

1.2 findIndex()

The

findIndex()
method returns the first item's index that satisfies the provided testing function. If no item is found, it returns
-1
.

Syntax:

arr.findIndex(Testing Function)

Here Testing Function is a function to execute on each value in the array.

let myArray = [5, 12, 8, 130, 44];
let itemIndex = myArray.findIndex(function(eachItem) {
console.log(eachItem);
});
JAVASCRIPT

In the above code snippet, the below function is a Testing Function.

function(eachItem) { console.log(eachItem); }

Try out the

splice()
and
findIndex()
methods in the below Code Playground.

1.3 includes()

The

includes()
method returns
true
if the provided item exists in the array. If no item is found, it returns
false
.

Syntax:

arr.includes(item)

1.4 indexOf()

The

indexOf()
method returns the first index at which a given item can be found in the array. If no item is found, it returns
-1
.

Syntax:

arr.indexOf(item)

1.5 lastIndexOf()

The

lastIndexOf()
method returns the last index at which a given item can be found in the array. If no item is found, it returns
-1
.

Syntax:

arr.lastIndexOf(item)

1.6 find()

The

find()
method returns the first item's value that satisfies the provided testing function. If no item is found, it returns
undefined
.

Syntax:

arr.find(Testing Function)

1.7 unshift()

The

unshift()
method adds one or more items to the beginning of an array and returns the new array length.

Syntax:

arr.unshift(item1,item2, ..., itemN)

1.8 shift()

The

shift()
method removes the first item from an array and returns that removed item.

Syntax:

arr.shift()

1.9 concat()

The

concat()
method can be used to merge two or more arrays.

This method does not change the existing arrays but instead returns a new array.

Syntax:

let newArray = arr1.concat(arr2);
JAVASCRIPT

1.10 slice()

The

slice()
method returns a portion between the specified start index and end index(end index not included) of an array into a new array.

Syntax:

arr.slice(startIndex, endIndex)

1.11 join()

The

join()
method creates and returns a new string by concatenating all of the items in an array, separated by commas or a specified separator string.

If the array has only one item, then it will be returned without using the specified separator.

Syntax:

arr.join(separator)

Here

separator
is a string used to separate each item of the array. If omitted, the array items are separated with a comma.

1.12 sort()

The

sort()
method sorts the items of an array and returns the sorted array. The default sort order is ascending.

Syntax:

arr.sort()

Try out the above Array Methods in the below Code Playground.

Post a Comment

Please Select Embedded Mode To Show The Comment System.*

Previous Post Next Post

Contact Form