Photo by Hunters Race on Unsplash

9 Great Tips To Use Javascript Array Methods Like a Pro!

As a developer, I always reflect upon the code I write and read. Through this process, I have collected a bunch of useful tips.
In this post, I’m going to share those tips that relate to array methods.

Although I’m talking about array methods, these tips apply in other situations. Keep them in mind while you code.

The tips

Some are better naming conventions and rules on when to apply them.
Some are little tricks to make your code cleaner.
Most of them are very opinionated 😃.

I tried categorizing them into general and specific tips to make it easier to digest and use as a reference.

General tips

Name your functions

Future readers of the code shouldn’t have to think about what’s that function is doing. Be a nice human and use meaningful names.

name your functions

Don’t pass arguments from one function to another

Array methods call functions that were sent to them with specific arguments. There is no need to explicitly pass those arguments through another function.

Don’t pass arguments from one function to another

Use partial application

Do you need more than whats passed to you by the array method? Use partial application.

don’t know what’s a partial application? check this out.

Use partial application

Break long chains or Assign them to a variable/function

When I see 3 or 4 levels of array methods chained together without anything indicating the result of that chain, I ask myself, Why? Why do I have to go over each line and figure out what the result is going to be?
There are two ways we can solve this.
1. Break the chain — assign the result of each line to a variable and operate on that variable.
2. Assign the result to a function or a variable with a meaningful name.

let’s say we want to find all employees that are above 18, give them a random bonus and then get the sum of their salaries.

Break long chains or Assign them to a variable/function

Map tips

When transforming from type A to B use “toB” as the function name and “A” or “fromA” as the function argument

For example, let’s say we want to transform error codes into human-readable error messages.

In this example A is errorCode and B is errorMessage.

from type A to B

In this example, it’s clear from our code what we intend to do.
toErrorMessage function conveys that we are transforming to B.
Our array should tell us that we are operating on error codes. But, if we screw up the naming of the array, then it’s clear from the function argument we are operating on A.

Performing actions

We can use the same convention we used in the above example, but it feels a bit awkward and overly verbose.
Instead, for actions, we will just state the action we are performing.

Let’s say we want to add a unique id to an array of users

Add id

Filter tips

Use it when it’s the right tool for the job

When is filter the right tool for the job? When you want to get a subset of an array based on some condition.
In other cases, where you want to get a specific member, assert that a condition holds for at least one member or for all of them, use find, some, or every — know your tools and when to use them.

Don’t really know these methods? Read about them find, some and every.

Use the right tool for the job

Make it sound like a question

This one applies to all conditional statements.
If the return value of our function is a boolean i.e true or false, then we should write our function in a way that will read like a question.

Make it sound like a question

Some common prefixes are is, has, should…

Check for multiple conditions in one pass

If you want to check for multiple conditions in one pass, use ramda anyPass and allPass functions when you want to combine multiple conditions while adhering to SRP.

For example, let’s say we want to get all the even numbers that are bigger than 10 OR odd numbers that are smaller than 10.

Check for multiple conditions in one pass

We added some code, but look at it, it’s so clear what we want to achieve!

If you don’t like the functional approach or your team is not familiar with ramda, there are other ways to get the same result, like plugging the functions we wrote into the if statements in the first implementation of isValidNumber.

Want to apply multiple functions in one pass using map? check out ramda pipe or compose.

Got any tips to share?

Those were my greatest hits for using array methods.
Got any tips of your own? Found something new or interesting in this post?
Leave a comment, share this post with your fellow developers, and don't forget to clap😄