15 Commonly used JavaScript array functions

🚀 JavaScript arrays are like Swiss Army knives for developers—compact, versatile, and indispensable. Whether you’re building sleek web interfaces or crunching data behind the scenes, understanding how to manipulate arrays efficiently is key to writing clean and effective code. In this post, we’ll explore 15 commonly used JavaScript array functions that every JavaScript developer should have in their toolkit. From classics like .map() and .filter() to lesser-known gems that can streamline your workflow, get ready to level up your coding game with these powerful tools.

15 Commonly used JavaScript array functions

push()

Adds one or more elements to the end of an array.

let arr = [1, 2];
arr.push(3); 
console.log(arr); // [1, 2, 3]

pop()

Removes the last element of an array and returns it.

let arr = [1, 2, 3];
arr.pop(); 
console.log(arr); // [1, 2]

shift():

Removes the first element of an array and returns it.

let arr = [1, 2, 3];
arr.shift(); 
console.log(arr); // [2, 3]

unshift()

Adds one or more elements to the beginning of an array.

let arr = [2, 3];
arr.unshift(1); 
console.log(arr); // [1, 2, 3]

map()

Creates a new array by applying a function to each element.

let arr = [1, 2, 3];
let doubled = arr.map(x => x * 2);
console.log(doubled); // [2, 4, 6]

filter()

Returns a new array with elements that pass the test function.

let arr = [1, 2, 3, 4];
let even = arr.filter(x => x % 2 === 0);
console.log(even); // [2, 4]

reduce()

Reduces array to a single value using a reducer function.

let arr = [1, 2, 3, 4];
let sum = arr.reduce((acc, val) => acc + val, 0);
console.log(sum); // 10

forEach()

Executes a function for each element (no return).

let arr = [1, 2, 3];
arr.forEach(x => console.log(x * 2));
// Output: 2, 4, 6

find()

Returns the first element that satisfies the condition.

let arr = [5, 12, 8];
let found = arr.find(x => x > 10);
console.log(found); // 12

findIndex()

Returns the index of the first element that satisfies the condition.

let arr = [5, 12, 8];
let index = arr.findIndex(x => x > 10);
console.log(index); // 1

includes()

Checks if the array includes a certain value.

let arr = [1, 2, 3];
console.log(arr.includes(2)); // true

some()

Checks if at least one element satisfies the condition.

let arr = [1, 2, 3];
console.log(arr.some(x => x > 2)); // true

every()

Checks if all elements satisfy the condition.

let arr = [2, 4, 6];
console.log(arr.every(x => x % 2 === 0)); // true

slice()

Returns a shallow copy of part of the array.

let arr = [1, 2, 3, 4];
let part = arr.slice(1, 3);
console.log(part); // [2, 3]

splice()

Adds/removes items from an array and returns the removed items.

let arr = [1, 2, 3, 4];
arr.splice(1, 2, 9, 10);
console.log(arr); // [1, 9, 10, 4]

Conclusion:

Mastering JavaScript array functions isn’t just about memorizing syntax—it’s about unlocking the full potential of your code. By understanding and using these 15 essential methods, you gain the power to write cleaner, more efficient, and more readable programs. Whether you’re filtering data, transforming values, or reordering content, these tools are the building blocks of modern JavaScript development. So go ahead—experiment, explore, and make these array functions part of your everyday coding arsenal. Happy coding! 🎉

You may also like this:

• Creating a Drag-and-Drop List with JavaScript
• Real-Time Weather App with JavaScript and OpenWeatherMap API