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.
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/