10 Most Important Array Functions in JavaScript

In JavaScript, you can declare an array using square brackets [].

Arrays are used to store multiple values in a single variable.

// Declaration of an array
let myArray = []; // An empty array
let numbers = [1, 2, 3, 4, 5]; // An array with numbers
let fruits = ["apple", "banana", "orange"]; // An array with strings

Once you have an array, you can use various built-in array functions to manipulate and interact with the data.

1. push(): Adds one or more elements to the end of an array and returns the new length of the array.javascriptCopy code

let colors = ["red", "green", "blue"];
colors.push("yellow");
console.log(colors); // Output: ["red", "green", "blue", "yellow"]

2. pop(): Removes the last element from an array and returns that element.javascriptCopy cod

let numbers = [1, 2, 3, 4, 5];
let lastNumber = numbers.pop();
console.log(lastNumber); // Output: 5
console.log(numbers); // Output: [1, 2, 3, 4]

3. shift(): Removes the first element from an array and returns that element. This also shifts the remaining elements one position to the left.javascriptCopy code

let colors = ["red", "green", "blue"];
let firstColor = colors.shift();
console.log(firstColor); // Output: "red"
console.log(colors); // Output: ["green", "blue"]

4. unshift(): Adds one or more elements to the beginning of an array and returns the new length of the array.javascriptCopy code

let numbers = [2, 3, 4];
numbers.unshift(1);
console.log(numbers); // Output: [1, 2, 3, 4]

5. splice(): Allows you to add or remove elements from a specific index in an array.javascriptCopy code

let fruits = ["apple", "banana", "orange"];
fruits.splice(1, 1, "grape"); // Removes 1 element at index 1 and adds "grape" at the same index
console.log(fruits); // Output: ["apple", "grape", "orange"]

6. slice(): Returns a new array containing elements from the original array based on the specified start and end index (end index not included).javascriptCopy code

let numbers = [1, 2, 3, 4, 5];
let slicedArray = numbers.slice(1, 4); // Returns elements at index 1, 2, and 3
console.log(slicedArray); // Output: [2, 3, 4]

7. concat(): Combines two or more arrays to create a new array.javascriptCopy code

let fruits = ["apple", "banana"];
let vegetables = ["carrot", "broccoli"];
let mixedArray = fruits.concat(vegetables);
console.log(mixedArray); // Output: ["apple", "banana", "carrot", "broccoli"]

8. indexOf(): Returns the first index at which a given element can be found in the array. Returns -1 if the element is not present.javascriptCopy code

let colors = ["red", "green", "blue"];
let index = colors.indexOf("green");
console.log(index); // Output: 1

9. includes(): Determines whether an array includes a certain element and returns true or false.javascriptCopy code

let numbers = [1, 2, 3, 4, 5];
let includesThree = numbers.includes(3);
console.log(includesThree); // Output: true

10. forEach(): Executes a provided function once for each array element.javascriptCopy code

let numbers = [1, 2, 3];
numbers.forEach((num) => {
  console.log(num * 2);
});
// Output:
// 2
// 4
// 6

These are just some of the many useful array functions available in JavaScript. Arrays are a fundamental part of the language, and mastering array manipulation is crucial for effective JavaScript programming.

You can watch the detailed video for each and every array function in JavaScript:

Cheers!

Naveen

Naveen Automation Labs

Connect me on linkedin: https://www.linkedin.com/in/naveenkhunteta/