Download as pdf or txt
Download as pdf or txt
You are on page 1of 10

Technology  Data Science  Management  More  Blog  Search courses based on  Login Sign Up

What's New
Javascript Programming
Popular courses on
Explore Business Development Executive
Roles and Responsibilities in 2023
JavaScript Array Methods Shiksha Online
Difference Between Finance and Accounting

1 Like 423 views 6 min read Updated on Nov 6, 2022 C programming examples 
Programming Foundations
Chanchal Aggarwal 117 Blogs written Understanding the Keynesian Theory ofwith JavaScript, HTML
Employment
and ...
Cloud Migration: Process and Types Coursera  4.5
View All
With JavaScript array methods, developers can write codes faster and performs
various functions with an array. Let’s understand significant JavaScript array methods The Complete JavaScript
with their examples. Course : From Zero to
Expe...
UDEMY  4.9

JavaScript - The
Complete Guide
(Beginner + Advan...
UDEMY  4.6
View all top courses

Browse courses by
categories
Data Structures and Algorithms
Introduction to JavaScript Array Methods
iOS app development
In JavaScript, an array is a built-in data structure that includes a list of elements that
store multiple elements in a single variable. A JavaScript array can be used in Android app development
various ways and perform several functions thanks to JavaScript array methods.
Other Programming Languages
What are JavaScript Array Methods? Visual Basic
JavaScript provides array methods that can be used to modify and calculate arrays.
Every array method has a distinct function that executes a change or calculation to
an array and saves developers from writing standard functions from scratch.
Subscribe to newsletter
In this blog, we have shared some top JavaScript Array methods. Let’s know about Read daily with Shiksha Online blogs and
them. articles and improve your knowledge base!
Want to be a certified JavaScript developer? Explore top free JavaScript Subscribe
certifications.

Top JavaScript Array Methods Read more in Javascript


Converting Arrays to Strings Popular Blogs Latest Blogs
The JavaScript method toString() translates an array to a string of (comma-
separated) array values. Introduction to JavaScript
Data Types With Example...
4 min read
How to Find the JavaScript
Array Length
Copy code 3 min read
const subjects = ["English", "Hindi", "Mathematics", "Physics"];
document.getElementById("demo").innerHTML = subjects.toString() Top jQuery Interview
Questions and Answers
[2023]
Output: 7 min read
English, Hindi, Mathematics, Physics How to Use JavaScript
Array Filter
JavaScript Array length 2 min read
Array length shows the number of elements in an array.
How to Remove Duplicates
from JavaScript Array?
Copy code 3 min read
let subjects = ["English", "Hindi", "Mathematics", "Physics"];
View all blogs >
// find the length of the subjects array
let len = subjects.length;
console.log(len);

Output: 
4

JavaScript Array reverse()


It is used to return the array in reverse order. 

Copy code
let subjects = [English, Hindi, Mathematics, Physics];

// reversing the subjects array


let reversedArray = subjects.reverse();

console.log(reversedArray);

Output: 
[ Physics, Mathematics, Hindi, English ]

Explore more- Top JavaScript interview questions and answers


JavaScript Array sort()
This method is used to sort the items of an array in specific order i.e, ascending or
descending.

Copy code
let ages = ["52", "47", "56", "64"];

// sort the ages array in ascending order


let sortedArray = ages.sort();
console.log(sortedArray);
Output:
['47', '52', '56', '64']

JavaScript Array fill()


After filling the elements with a static value, the method returns a modified array.

Copy code
// defining an array
const subjects = ['English', 'Hindi', 'Mathematics'];

// filling every element of the array with 'Physics'


subjects.fill("Physics");

console.log(subjects)

Output: 

Copy code
['Physics', 'Physics', 'Physics']

Javascript Array join()


This method returns a new string by concatenating all the elements in an array,
distinct by a specific separator.

Copy code
Let message = ["All", "Is", "Well."];
// join all elements of array using space
let joinedMessage= message.join("");
console.log(joinedMessage)

Output: 
All Is Well.

JavaScript Array pop()


When we use arrays, we can add and remove elements to them. 
This is what the pop and push methods do.
Popping elements out of an array and pushing the elements into an array. 
The pop method removes the final item from an array and then returns it.
Example:

Copy code
let subjects= ["English", "Hindi", "Mathematics", "Physics"];
//remove the last element
let removedSubjects= Subjects.pop();

console.log(subjects) // ["English", "Hindi", "Mathematics"]


Console.log(removedCity); //Physics

Output:
[“English”, “Hindi”, “Mathematics”]
Also read: Java vs JavaScript: Difference between Java and JavaScript.
JavaScript Array push()
In this method, the array is expanded by one or more elements, and the new size of
the array is returned.

Copy code
const subjects= ["English", "Hindi", "Mathematics"];
console.log(subjects.push(“Physics”)); //3
console.log(subjects); // ["English", "Hindi", "Mathematics", "Physics"];

Output:
[“English”, “Hindi”, “Mathematics”, “Physics”]
JavaScript Array shift() 
The shift() function eliminates first item from an array and returns the removed item.
The array’s length is altered using this approach.
Example:

Copy code
let subjects = ["English", "Hindi", "Mathematics", "Physics"];
// removes the first element of the array
let first = subjects.shift();
console.log(first);
console.log(subjects)

Output:
English
['Hindi', 'Mathematics', 'Physics']

JavaScript Array unshift()


The unshift() method integrates a new item to an array (at the starting) and
“unshifts” the previous elements.

Copy code
let subjects = ["English", "Hindi", "Mathematics"];

// add "Physics" at the beginning of the array


languages.unshift("Physics");
console.log(languages)

Output: 
['Physics', 'English', 'Hindi', 'Mathematics']

JavaScript Array concat()


The Concat() method connects two or more additional arrays that results in the
creation of a new array without interrupting with the other arrays.
Copy code
let studentNames = [Riya, Ram, John, Farhan]
let Ages = [25, 20, 21, 23]

// join two arrays


let joinedArrays = studentNames.concat(Ages);
console.log(joinedArrays)

Output:
[
Riya, Ram, John, Farhan,
25, 20,21, 23
]

JavaScript Array splice()


The splice() methods return an array by changing, adding or removing its items in
place.
Example:

Copy code
let colors = [Black, White, Blue, Yellow, Green, Pink];

// replace 1 element from index 4 by Red


let removedElement = colors.splice(4, 1, Red);
console.log(removedElement);
console.log(colors)

Output: 
[ Green ] [ Black, White, Blue, Yellow, Red, Pink]

JavaScript Array indexOf()


It shows the first index value of the array or -1 if it is not available.

Copy code
let subjects = ["English", "Hindi", "Mathematics", "English"];

/ Find the index of first apperance of word "English"


let index = languages.indexOf("English");
console.log(index)

Output:
1

JavaScript Array lastIndexOf()


A lastIndexOf() method finds the last appearance of an item in an array.
Copy code
let ages = [12, 8, 13, 11, 09, 12, 07];

// searching the index of the last occurrence of 12


let lastIndex = priceList.lastIndexOf(12);

console.log(lastIndex);

Output:
5

Checkout the best- JavaScript Online Courses & Certifications


JavaScript Array find()
The find() function returns the value of the first array item that fulfills the given test
function.

Copy code
let numbers = [1, 3, 4, 9, 8];

// function to check even number


function iseven(element) {
return element % 2 == 0;
}

// get the first even number


let evenNumber = numbers.find(isEven);
console.log(evenNumber)

Output:
4

JavaScript Array findIndex()


The index of the first number is returned by this procedure.
Example:

Copy code
const array1 = [1, 6, 4, 130, 34];
const isSmallestNumber = (element => element > 13);
console.log(array1.findIndex(isSmallestNumber));

Output:
3

Javascript Array filter()


The filter() method creates a shallow copy of an array that is only comprised of the
elements from the array that pass the test set forth by the supplied function.
Copy code
const words = ['screen', 'heavy', 'less', 'past', 'rectangle', 'mouse'];

const result = words.filter(word => word.length > 4);

console.log(result);
// expected output: [ 'screen', 'heavy', 'rectangle', 'mouse'

Output:
[ 'screen', 'heavy', 'rectangle', 'mouse' ]

JavaScript Array map()


The map() function returns a new array that includes the results of performing a
function on each element of the original array.
Example:

Copy code
let numbers = [2, 3, 4, 5, 6];

// function to return the cube of a number


function cube(number) {
return number * number;
}

// apply cube() function to each element of the numbers list


let cube_numbers = numbers.map(cube);
console.log(cube_numbers);

Output:
[ 8, 27, 64, 124, 216 ]

Check out: JavaScript Functions


JavaScript Array of() Method
The array of() method forms a new Array instance based on the arguments
provided.
Example:

Copy code
// creating an array named vowels with elements A, E, I, O, U
let vowels = Array.of("A", "E", "I", "0", "U");

// display contents of vowles'


console.log(Vowles)

Output:
['A', 'E', 'I', '0', 'U']

JavaScript Array slice()


Slice() creates a new array object by making a shallow copy of a specific portion of
an array.

Copy code
let numbers = [5, 10, 15, 20, 25, 30];

// form another array by slicing numbers from index 1 to 4


let newArray = numbers.slice(1,4);
// console.log(newArray);
document.write(newArray);

Output:
[ 10, 15, 20 ]

JavaScript Array includes()


Include() in an array contains a specified element or not. 
Example:

Copy code
// defining an array
let subjects = ["English", "Hindi", "Mathematics"];

// checking whether the array contains 'Hindi'


let check = subjects.includes("Hindi");

console.log(check);

Output:
true

Javascript Array reduceRight()


The reduceRight() method executes a callback function on two array values (from
right to left) to reduce the array to a single value.

Copy code
let numbers = [2, 4, 6, 8];

// function that adds last two values of the numbers array


function sum_reducer(accumulator, currentValue) {
return accumulator + currentValue;
}

// returns a single value after reducing the numbers array


let sum = numbers.reduceRight(sum_reducer);

console.log(sum);

Output:
20

Javascript Array reduce()


The reduce() method performs a reducer function on each array element and returns
a single output value.
Copy code
const title = ["Winners ", "Never ", "Quit."];

// function to join each string element


function joinStrings(accumulator, currentValue) {
return accumulator + currentValue;
}

// reduce join each element of the string


let joinedString = title.reduce(joinStrings);
console.log(joinedString);

Output:
Shiksha Online Blogs.

Wrapping It Up!!
We can use the JavaScript array method to write cleaner codes which ultimately
makes JavaScript manipulation easier. So, use the above array methods and create
more accessible codes.

Found this blog helpful? Like and let us Share this blog with :
know
1 reader liked the  (423
Like blog views)

Chanchal Aggarwal
117 Blogs
Chanchal has a keen interest in writing and loves to experiment and explore different
genres of it. She chooses her passion as a full-time profession and became a
content creator. Using her experience, she curates content for aspirants seeking
guidance to fulfill their aspirations.

Home > Blogs > Technology > JavaScript Array Methods

You might also like