Check out my books on Amazon at https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62
Subscribe to my email list now at http://jauyeung.net/subscribe/
JavaScript is a very forgiving language. It’s easy to write code that runs but has mistakes in it.
In this article, we’ll look at returning values in certain callbacks, using block-scoped variables, cleaning up the if
statements, and returning clearly.
Returning Values in Callbacks Passed Into Array Methods
Many JavaScript array methods, like map
, from
, every
, some
, reduce
, find
, findIndex
, reduceRight
, filter
, and sort
, take a callback.
The callbacks that are passed in should return some value so that these methods can return a proper value, allowing us to do other things. For instance, the following code is probably useless and a mistake:
const arr = [1, 2, 3];
const mapped = arr.map(() => {});
Then we see that the value of mapped
is [undefined, undefined, undefined]
. It’s probably not what we want. Therefore, we should make sure that the callbacks that these array methods take return a value so that we don’t get something unexpected.
We shouldn’t have callbacks that don’t return any value unless we’re 100% sure that we want to do this.
Use Block-Scoped Variables
If we use var
to declare variables, we should treat them as if they’re block-scoped so that we don’t cause confusion for ourselves and other developers.
For instance, we can write something like this:
foo
logs true
as we expected, but the confusion is that we declared var foo
twice in one if
block.
We should treat var
like a block-scoped variable to reduce confusion, so we should instead write:
Better yet, we should use let
for block-scoped variables:
let
is always block-scoped so that we can’t put the variables anywhere we want like with var
.
Class Method Should Reference this
Instance methods should reference this
in a JavaScript class. Otherwise, there’s no point in it being an instance method. If we don’t need to reference this
in a class method, then it should be a static method.
For instance, if we have:
The bar
shouldn’t be an instance method since it doesn’t reference this
. Instead, we should make it a static method as follows:
Limiting Linearly Independent Paths Through a Piece of Code
We shouldn’t have too many else if
blocks in any if
statement to reduce complexity. To make code easy to read, we should reduce the number of paths that an if
statement can take.
For instance, we can write:
We should consider reducing the cases of if
statements.
Photo by Rod Long on Unsplash.
Return Statements Should Specify a Value or Not Specify a Value
In JavaScript, the return
statement can return undefined
in multiple ways. return
with nothing after it returns undefined
. return
with void
after it and expression after void
also returns undefined
.
return
with undefined
after it also returns undefined
.
We should consider returning with nothing or returning undefined
or an expression explicitly to make what we’re trying to return or not return clear.
So we should either write:
const bar = () => {
return;
}
or:
const bar = () => {
return 1;
}
or:
const bar = () => {
return undefined;
}
The void
operator is rarely used, so most developers aren’t familiar with it. Its use is also limited. Therefore, it’s not used often.
Conclusion
Many array methods take a callback that should return a value. Instance methods like map
, reduce
, filter
, etc. all have callbacks that should return values.
Class instance methods should reference this
. If they don’t, then they should be static methods.
if
statements shouldn’t be too complex. Keep the number of paths to a minimum.
Finally, return
should return values or nothing rather than using the void
operator with it.