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.
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.
Top comments (0)