DEV Community

Cover image for 10 Lesser-Known JavaScript Array Methods You Might’ve Missed
Mainul Hasan
Mainul Hasan

Posted on • Originally published at javascript.plainenglish.io

10 Lesser-Known JavaScript Array Methods You Might’ve Missed

Arrays stand as pivotal elements in JavaScript. Developers can craft more streamlined code by leveraging array methods, accelerating web development.

While methods like push(), pop(), and splice() are commonly recognized and widely adopted, the JavaScript array API has many other handy methods.

In this article, we’ll explore 10 such methods, which might be lesser known but are invaluable in certain scenarios of application development.

1. Array.from():

It saves you tonnes of time with array-like objects. Convert NodeLists or other iterable structures directly into arrays. Use Array.from() when working with DOM elements, and you want to use all the power of array methods.



let nodeList = document.querySelectorAll('div');
let arrayFromNodeList = Array.from(nodeList);
console.log(arrayFromNodeList);  // Converts NodeList to Array


Enter fullscreen mode Exit fullscreen mode

2. Array.of():

This method creates a new array from its arguments, a handy alternative to the traditional Array() constructor.



let arrUsingArray = Array(7);
let arrUsingArrayOf = Array.of(7);
console.log(arrUsingArray);   // [ <7 empty items> ]
console.log(arrUsingArrayOf); // [7]


Enter fullscreen mode Exit fullscreen mode

A concise way to initialize arrays without unexpected results.

3. Array.fill():

Initialize or reset arrays with uniform values using fill().



let defaultArray = new Array(5).fill('default');
console.log(defaultArray);  // ["default", "default", "default", "default", "default"]


Enter fullscreen mode Exit fullscreen mode

4. Array.find():

A quicker way to locate the first item in an array that meets a specific condition. Perfect for those quick look-ups when you only need the first match.



let numbers = [5, 12, 8, 130, 44];
let found = numbers.find(element => element > 10);
console.log(found);  // 12


Enter fullscreen mode Exit fullscreen mode

5. Array.findIndex():

findIndex(), a close relative of find(), returns the index of the first element that meets the provided testing function.



let numbers = [5, 12, 8, 130, 44];
let index = numbers.findIndex(element => element > 10);
console.log(index);  // 1


Enter fullscreen mode Exit fullscreen mode

6. Array.flat():

Clean up multi-dimensional arrays effortlessly with flat().



let nestedArray = [1, [2, 3], [4, [5, 6]]];
let flattened = nestedArray.flat();
console.log(flattened);  // [1, 2, 3, 4, [5, 6]]


Enter fullscreen mode Exit fullscreen mode

7. Array.flatMap():

For simultaneous mapping and flattening, flatMap() is indispensable.



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


Enter fullscreen mode Exit fullscreen mode

8. Array.some():

For those times when you only need to know if any elements meet a condition, rather than all of them.



let array = [1, 2, 3, 4, 5];
let check = array.some(num => num % 2 === 0);
console.log(check);  // true (because there's at least one even number)


Enter fullscreen mode Exit fullscreen mode

Fast validations or quick checks where a single true condition is enough.

9. Array.reduceRight():

An alternative to reduce(), reduceRight() tackles the array from the end.



let fruits = ["apple", "banana", "cherry", "date"];
let concatenatedFruits = fruits.reduceRight((accumulator, currentValue) => accumulator + " " + currentValue);
console.log(concatenatedFruits);  // date cherry banana apple


Enter fullscreen mode Exit fullscreen mode

Perfect for unique calculations or evaluations where processing order is crucial.

10. Array.copyWithin():

Duplicate segments within an array with copyWithin().



let numbers = [1, 2, 3, 4, 5];
let result = numbers.copyWithin(-2);
console.log(result);  // [1, 2, 3, 1, 2]


Enter fullscreen mode Exit fullscreen mode

It’s useful in data mirroring, algorithm implementation, or crafting patterns without external libraries.

While the more well-known methods are the backbone of our daily coding, these less well-known ones can be powerful allies in very specific scenarios.

Let’s share in the comments below if you know any other unfamiliar handy JS arrays!

Feel free to connect with me on Twitter or LinkedIn.

Read Next...

Top comments (0)