DEV Community

15 JavaScript Array Functions You Should Master as a Senior Dev

Dipak Ahirav on August 14, 2024

JavaScript arrays are a fundamental part of the language, and mastering the array functions it offers is essential for any senior developer. These ...

Read full post

Tracy Gilmore • Aug 16 • Edited

Nice article Dipak,
For those wanting to know more on this topic, I recommend visiting the authoritative web site: MDN JavaScript Array.
I think it is also worth noting that some developers will highlight the fact that methods such as forEach perform worse than a regular for loop. However, I would argue:

If you want performance why are you writing JavaScript (side note, I Love JS).
There should be a balance in the code between performance and maintainability.

I would go further to suggest that the declarative style of forEach and map etc. is easier to read and comprehend, but that might just be me.

On the performance issue, one should ask the question "How performant does it need to be?" The usual answer for frontend is "fast enough so the user is not waiting and wondering if the browser has crashed". If the functionality really needs to be in the browser there are other options than using JS in the main thread such as Web Workers or even Web Assembly. On the backend there is no real reason (if performance really is paramount) to be using JS, there are plenty of other options.

Regards.

PetruLunic • Aug 15

These should know every junior

Helio Alves • Aug 16

Really, senior developers should know these? I think every developer should know some of them, others shouldn't be used since they mutate the array and we should instead use toSlice, toSort, etc which don't mutate the array.

Alex Petrik • Aug 15

sigh, just reiterating a well-known topic?

richant febriel • Aug 16 • Edited

thanks for the explaination, but i still confuse about splice(),

const numbers = [1, 2, 3, 4, 5];
numbers.splice(2, 1, 99);
console.log(numbers); // [1, 2, 99, 4, 5]

in splice parameter, it say '2' for index 2 which means refer to '3', and '99' parameter is refer to what number will be changed to. but '1' in parameter means to what? can someone explain me

btw, sorry for my bad english

Dipak Ahirav • Aug 16 • Edited

Thank you for your question! @richantfebriel

The second parameter in splice() specifies the number of elements to remove starting at the index given by the first parameter. For example:

const numbers = [1, 2, 3, 4, 5];
numbers.splice(2, 1, 99);
console.log(numbers); // [1, 2, 99, 4, 5]

Here, 1 means remove one element (which is 3). If you change 1 to 2:

const numbers = [1, 2, 3, 4, 5];
numbers.splice(2, 2, 99);
console.log(numbers); // [1, 2, 99, 5]

This removes two elements (3 and 4), and then inserts 99.

I hope this clears up the confusion!

richant febriel • Aug 16

thanks for the explanation, easy to understand!

Dipak Ahirav • Aug 16

your welcome

Allen G. Clarke • Aug 15

Calling it array methods would be okay

Petr Fischer • Aug 15

Eh... So... In short: every developer should read the javascript documentation for Array and Hash... Surprising! What an article!

Dipak Ahirav • Aug 16

Thanks @petrfischer

Andrew Tirpok • Aug 15

Nice refresher! Sometimes I forget some of these exist. Also, for...of is useful as well.

Kat • Aug 14

Thanks for the list - certainly some things for me to try here!

roshan khan • Aug 19

thanks for the share. this list will help me immensely!

mohamed karim • Aug 18

Thank for sharing

David Miller • Aug 18

As a junior dev, I appreciate the curated list for refreshment purposes. A bit easier of a read than MDN docs.

Dipak Ahirav • Aug 18

Thanks @dmiller72

MsM Robin • Aug 18

Great, But these are the basic functions. This should be only for junior devs. Those who are senior devs already know all of the functions.

Aavash Parajuli • Aug 16

Reach++

NIKHIL CM • Aug 16 • Edited

Appreciate your effort, but it is not specific to Seniors, every junior devs (should) knows this too. Also, there are several articles about array methods already in dev.to