Write an article or Share a link

Top 8 Javascript Array Methods

Hints Staff
5 months ago
Top 8 Javascript Array Methods by html hints

In JavaScript, array is a special type of variable that allows you to store multiple values in a single variable. Here are 10 javascript array methods you should at least know

#splice()

Adds/Removes elements from particular location of an array.

                    
let arr = ["I", "love", "JS"];

arr.splice(1, 1); // from index 1 remove 1 element

alert( arr ); // ["I", "JS"]
                    
                  

The splice method is also able to insert the elements without any removals. For that we need to set deleteCount to 0:

                    
let arr = ["I", "study", "JS"];

// from index 2
// delete 0
// then insert "complex" and "language"
arr.splice(2, 0, "complex", "language");

alert( arr ); // "I", "study", "complex", "language", "JS"
                    
                  

#forEach()

This method can help you to loop over array's items.

                    
const num = [1, 2, 3, 4, 5, 6];

num.forEach(item => {
  console.log(item); // output: 1 2 3 4 5 6
});
                    
                  

#filter()

This method create new array with only elements passed condition inside the provided function.

                    
const num = [1, 2, 3, 4, 5, 6];

// item(s) greater than 3
const filtered = num.filter(num => num > 3);
console.log(filtered); // output: [4, 5, 6]

console.log(num); // output: [1, 2, 3, 4, 5, 6]
                    
                  

#map()

This method create new array by calling the provided function in every element.

                    
const num = [1, 2, 3, 4, 5, 6];

// add one to every element
const oneAdded = num.map(num => num + 1);
console.log(oneAdded); // output [2, 3, 4, 5, 6, 7]

console.log(num); // output: [1, 2, 3, 4, 5, 6]
                    
                  

#push()

Adding Element at the end of an Array. As array in JavaScript are mutable object, we can easily add or remove elements from the Array. And it dynamically changes as we modify the elements from the array.

                    
// Adding elements at the end of an array 
// Declaring and initializing arrays 
var number_arr = [ 10, 20, 30, 40, 50 ]; 
var string_arr = [ "a", "b", "c", "d" ]; 

// push() 
// number_arr contains [10, 20, 30, 40, 50, 60] 
number_arr.push(60); 

// We can pass multiple parameters to the push() 
// number_arr contains 
// [10, 20, 30, 40, 50, 60, 70, 80, 90] 
number_arr.push(70, 80, 90); 

// string_arr contains 
// ["a", "b", "c", "d", "y", "x"]; 
string_arr.push("y", "x"); 

// Printing both the array after performing push operation 
console.log("After push op " + number_arr); 
console.log("After push op " + string_arr); 
                      
                    
                  

#pop()

Removing elements from the end of an array.

                    
// Removing elements from the end of an array 
// Declaring and initializing arrays 
var number_arr = [ 20, 30, 40, 50 ]; 
var string_arr = [ "x", "y", "z" ]; 

// pop() 
// number_arr contains 
// [ 20, 30, 40 ] 
number_arr.pop(); 

// string_arr contains 
// ["x", "y"] 
string_arr.pop(); 

// Printing both the array after performing pop operation 
console.log("After pop op " + number_arr); 
console.log("After popo op " + string_arr); 
                      
                    
                  

#reduce()

The reduce() method applies a function against an accumulator and each element in the array (from left to right) to reduce it to a single value - MDN

                    
const arr = [1, 2, 3, 4, 5, 6];

const sum = arr.reduce((total, value) => total + value, 0);
console.log(sum); // 21
                    
                  

#shift()

Removing elements at the beginning of an array

                    
// Removing element from the beginning of an array 
// Declaring and initializing arrays 
var number_arr = [ 20, 30, 40, 50, 60 ]; 
var string_arr = [ "x", "y", "z", "a" ]; 

// shift() 
// number_arr contains 
// [30, 40, 50, 60]; 
number_arr.shift(); 

// string_arr contains 
// ["y", "z", "a"] 
string_arr.shift(); 

// Printing both the array after performing shifts operation 
console.log("After shift op " + number_arr); 
console.log("After shift op " + string_arr); 
                      
                    
                  
JavaScript

We use cookies to ensure better User Experience. Read More