JavaScript Array Methods

Read

Courses

JavaScript Array Methods contains some built-in properties and methods that every JavaScript developer should know. We can use them to add, remove, iterate, or manipulate data as per our requirements.

Array Methods in JavaScript

We will be discussing the following array methods with detail descriptions and examples.

Table of Content

JavaScript Array length

The length property returns the length of the given array.

Syntax:

Array.length

Example: Getting the length of the given array.

Javascript

// Original Array 
let courses = ["HTML", "CSS", "JavaScript", "React"]; 
  
// Accessing the Array Length 
console.log(courses.length);

Output

JavaScript Array toString() Method

The toString() method converts the given value into the string.

Syntax:

arr.toString()

Example: Converting the given array into the strings.

Javascript

// Original Array 
let courses = ["HTML", "CSS", "JavaScript", "React"]; 
  
// Converting array ot String 
let str = courses.toString(); 
  
console.log(str);

Output

HTML,CSS,JavaScript,React

JavaScript Array join() Method

This join() method helps to join two arrays as a string. If we pass any parameter to this method it will join the array by using that parameter.

Syntax:

array.join(separator)

Example: Joing the given array by “|” symbol.

Javascript

// Original Array 
let courses = ["HTML", "CSS", "JavaScript", "React"]; 
  
// Joining the array elements 
console.log(courses.join('|'));

Output

HTML|CSS|JavaScript|React

JavaScript Array delete Operator

The delete operator used to delete the given value that can be object, array or anything.

Syntax:

delete object
// or
delete object.property
// or
delete object['property']

Example: Deleting the given object’s property by using delete operator.

Javascript

let emp = {  
    firstName: "Raj",  
    lastName: "Kumar",  
    salary: 40000  
}  
  
console.log(delete emp.salary);  
console.log(emp);

Output

true
{ firstName: 'Raj', lastName: 'Kumar' }

JavaScript Array concat() Method

The concat() method is used to concatinate the two or more arrays and it gives the mergerd array.

Syntax:

let newArray = arr.concat()  // or
let newArray = arr1.concat(arr2) // or
let newArray = arr1.concat(arr2, arr3, ...) // or
let newArray = arr1.concat(value0, value1)

Example: Concatinate method to concatinate of three arrays.

Javascript

// Declare three arrays 
let arr1 = [11, 12, 13]; 
let arr2 = [14, 15, 16]; 
let arr3 = [17, 18, 19]; 
  
let newArr = arr1.concat(arr2, arr3); 
console.log(newArr);

Output

[
  11, 12, 13, 14, 15,
  16, 17, 18, 19
]

JavaScript Array flat() Method

The flat() method is used to flattend the array i.e. it merge all the given array and reduce all the nesting present in it.

Syntax:

arr.flat([depth])

Example: Reducing the nesting of the given array using flat() method.

Javascript

// Creating multilevel array 
const arr = [['1', '2'], ['3', '4', '5',['6'], '7']]; 
  
// Flat the multilevel array 
const flatArr= arr.flat(Infinity); 
console.log(flatArr);

Output

[
  '1', '2', '3',
  '4', '5', '6',
  '7'
]

Javascript Array.push() Method

The push() method is used to add element at the end of an Array. As arrays in JavaScript are mutable objects, we can easily add or remove elements from the Array. And it dynamically changes as we modify the elements from the array.

Syntax:

Array.push(item1, item2 …)

Example: Adding new elements such as some numbers and some string values to the end of the array using the push() method.

JavaScript

// Declaring and initializing arrays 
let numArr = [10, 20, 30, 40, 50]; 
  
// Adding elements at the end of an array 
numArr.push(60); 
numArr.push(70, 80, 90); 
console.log(numArr); 
  
  
let strArr = ["piyush", "gourav", "smruti", "ritu"]; 
strArr.push("sumit", "amit"); 
  
console.log(strArr);

Output

[
  10, 20, 30, 40, 50,
  60, 70, 80, 90
]
[ 'piyush', 'gourav', 'smruti', 'ritu', 'sumit', 'amit' ]

Javascript Array.unshift() Method

The unshift() method is used to add elements to the front of an Array.

Syntax:

Array.unshift(item1, item2 …)

Example: Adding new elements to the beginning of the array using the unshift() method.

JavaScript

// Declaring and initializing arrays 
let numArr = [20, 30, 40]; 
  
// Adding element at the beginning 
// of an array 
numArr.unshift(10, 20); 
console.log(numArr); 
  
  
// Declaring and initializing arrays 
let strArr = ["amit", "sumit"]; 
  
// Adding element at the beginning 
// of an array 
strArr.unshift("sunil", "anil"); 
console.log(strArr);

Output

[ 10, 20, 20, 30, 40 ]
[ 'sunil', 'anil', 'amit', 'sumit' ]

JavaScript Array.pop() Method

The pop() method is used to remove elements from the end of an array.

Syntax:

Array.pop()

Example: Remove an element from the end of the array using the pop() method.

JavaScript

// Declare and initialize array 
let numArr = [20, 30, 40, 50]; 
  
// Removing elements from end  
// of an array 
numArr.pop(); 
  
console.log(numArr); 
  
  
// Declare and initialize array 
let strArr = ["amit", "sumit", "anil"]; 
  
// Removing elements from end  
// of an array 
strArr.pop(); 
  
console.log(strArr);

Output

[ 20, 30, 40 ]
[ 'amit', 'sumit' ]

JavaScript Array.shift() Method

The shift() method is used to remove elements from the beginning of an array

Syntax:

Array.shift()

Example: Remove an element from the beginning of an array.

JavaScript

// Declare and initialize array 
let numArr = [20, 30, 40, 50]; 
  
// Removing elements from the  
// beginning of an array 
numArr.shift(); 
  
console.log(numArr); 
  
  
// Declare and initialize array 
let strArr = ["amit", "sumit", "anil"]; 
  
// Removing elements from the  
// beginning of an array 
strArr.shift(); 
  
console.log(strArr);

Output

[ 30, 40, 50 ]
[ 'sumit', 'anil' ]

JavaScript Array.splice() Method

The splice() method is used to Insert and Remove elements in between the Array.

Syntax:

Array.splice (start, deleteCount, item 1, item 2….)

Example: Removing an element and adding new elements at the same time using the splice() method.

JavaScript

// Declare and initialize array 
let numArr = [20, 30, 40, 50]; 
  
// Removing an adding element at a  
// particular location in an array 
  
// Delete 3 elements starting from index 1 
numArr.splice(1, 3); 
  
// Insert 80, 90, 100 at starting index 1 
numArr.splice(1, 0, 3, 4, 5); 
  
console.log(numArr); 
  
  
// Declare and initialize array 
let strArr = ["amit", "sumit", "anil"]; 
  
// Delete two elements starting from index 1 
// and add three elements. 
strArr.splice(1, 2, "Geeks", "Geeks1", "Geeks2"); 
  
console.log(strArr);

Output

[ 20, 3, 4, 5 ]
[ 'amit', 'Geeks', 'Geeks1', 'Geeks2' ]

JavaScript Array.slice() Method

The slice() method returns a new array containing a portion of the original array, based on the start and end index provided as arguments

Syntax:

Array.slice (startIndex , endIndex);

Example: Cover all slice() method corner cases.

Javascript

// Original Array 
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; 
  
// Case 1: Extract the first 3 elements of the array 
const case1 = arr.slice(0, 3); 
console.log("First 3 Array Elements: ", case1); 
  
// Case 2: Extract the last 3 array elements 
const case2 = arr.slice(-3); 
console.log("Last 3 Array Elements: ", case2); 
  
// Case 3: Extract elements from middle of array 
const case3 = arr.slice(3, 7); 
console.log("Case 3: Extract elements from middle: ", case3); 
  
// Case 4: Start index is greater than end index 
const case4 = arr.slice(5, 2); 
console.log("Case 4: Start index is greater than end index: ", case4); 
  
// Case 5: Negative start index 
const case5 = arr.slice(-4, 9); 
console.log("Case 5: Negative start index: ", case5); 
  
// Case 6: Negative end index 
const case6 = arr.slice(3, -2); 
console.log("Case 6: Negative end index: ", case6); 
  
// Case 7: Only start index is provided 
const case7 = arr.slice(5); 
console.log("Case 7: Only start index is provided: ", case7); 
  
// Case 8: Start index and end index are out of range 
const case8 = arr.slice(15, 20); 
console.log("Case 8: Start and end index out of range: ", case8); 
  
// Case 9: Start and end index are negative 
// and out of range 
const case9 = arr.slice(-15, -10); 
console.log("Case 9: Start and end index are negative"
    + " and out of range: ", case9);

Output:

First 3 Array Elements:  [ 1, 2, 3 ]
Last 3 Array Elements:  [ 8, 9, 10 ]
Case 3: Extract elements from middle:  [ 4, 5, 6, 7 ]
Case 4: Start index is greater than end index:  []
Case 5: Negative start index:  [ 7, 8, 9 ]
Case 6: Negative end index:  [ 4, 5, 6, 7, 8 ]
Case 7: Only start index is provided:  [ 6, 7, 8, 9, 10 ]
Case 8: Start and end index out of range:  []
Case 9: Start and end index are negative and out of range:  []

JavaScript Array some() Method

The some() method checks whether at least one of the elements of the array satisfies the condition checked by the argument function.

Example: Basic example of Array some() method.

Javascript

function isGreaterThan5(element, index, array) { 
    return element > 5; 
} 
  
  
// Driver code 
// Original array 
let array = [2, 5, 8, 1, 4]; 
  
// Checking for condition in array 
let value = array.some(isGreaterThan5); 
  
console.log(value);

Output

true

JavaScript Array reduce() Method

The reduce() method is used to reduce the array to a single value and executes a provided function for each value of the array (from left to right) and the return value of the function is stored in an accumulator.

Example: Here is an example of the basic use of the Array reduce() method.

Javascript

// Original array 
let arr = [88, 50, 25, 10]; 
  
// Perform reduce method 
let sub = arr.reduce(geeks); 
  
function geeks(total, num) { 
    return total - num; 
} 
  
console.log(sub);

Output

JavaScript Array map() Method

The map() method creates an array by calling a specific function on each element present in the parent array. It is a non-mutating method. This method iterates over an array and call the function on every element of an array.

Example: Here is an example of the basic use of the Array map() method.

Javascript

// Original array 
let arr = [4, 9, 16, 25]; 
  
// Performing map method 
let sub = arr.map(geeks); 
  
function geeks() { 
    return arr.map(Math.sqrt); 
} 
  
console.log(sub);

Output

[ [ 2, 3, 4, 5 ], [ 2, 3, 4, 5 ], [ 2, 3, 4, 5 ], [ 2, 3, 4, 5 ] ]

JavaScript Array Complete Reference

We have created a complete list of array methods, please check this article JavaScript Array Complete Reference for more detail.

Note: All the above examples can be tested by typing them within the script tag of HTML or directly into the browser’s console.

Last Updated : 19 Jan, 2024

JavaScript Arrays

Best-Known JavaScript Array Methods

Share your thoughts in the comments

Jan	FEB	Mar
	21
2023	2024	2025

JavaScript Basics

JS Variables & Datatypes

JS Operators

JS Loops

JS Perfomance & Debugging

JS Object

JS Function

JS Array

JS String

JS Numbers

JS Math

JS Map

JS Set

JS Objects

JS Advance

JavaScript Exercises

JavaScript Basics

JS Variables & Datatypes

JS Operators

JS Loops

JS Perfomance & Debugging

JS Object

JS Function

JS Array

JS String

JS Numbers

JS Math

JS Map

JS Set

JS Objects

JS Advance

JavaScript Exercises

JavaScript Array Methods

Array Methods in JavaScript

JavaScript Array length

Syntax:

Javascript

JavaScript Array toString() Method

Syntax:

Javascript

JavaScript Array join() Method

Syntax:

Javascript

JavaScript Array delete Operator

Syntax:

Javascript

JavaScript Array concat() Method

Syntax:

Javascript

JavaScript Array flat() Method

Syntax:

Javascript

Javascript Array.push() Method

Syntax:

JavaScript

Javascript Array.unshift() Method

Syntax:

JavaScript

JavaScript Array.pop() Method

Syntax:

JavaScript

JavaScript Array.shift() Method

Syntax:

JavaScript

JavaScript Array.splice() Method

Syntax:

JavaScript

JavaScript Array.slice() Method

Syntax:

Javascript

JavaScript Array some() Method

Javascript

JavaScript Array reduce() Method

Javascript

JavaScript Array map() Method

Javascript

JavaScript Array Complete Reference

Please Login to comment...

What kind of Experience do you want to share?