To make code easy to read and maintain, we should follow some best practices.
In this article, we’ll look at some best practices we should follow to make everyone’s lives easier.
No await Without Promises
We should use await
only with promises.
It’s definitely an error if we use await
with anything else.
For instance, instead of writing:
async function foo(){
return 10;
}
We write:
async function foo(){
const val = await aPromise;
}
No Comma Operator
We should never use the comma operator.
All it does is return the last thing in the list.
So instead of writing”
switch (foo) {
case 1, 2, 3:
return true;
case 4, 5:
return false;
}
We write:
switch (foo) {
case 3:
return true;
case 5:
return false;
}
Use Curly Braces for if, for, do, or while Statements
We should use curly braces for these statements so that we know where block starts or ends.
Instead of writing:
if (foo === 'baz')
foo = 10;
We write:
if (foo === 'baz') {
foo = 10;
}
This way, if we have anything below it, we won’t mistaken it to be within the block.
for-in Should have Filtered with an if Statement
If we write a for-in loop, we should filter out the inherited properties with hasOwnProperty
.
For instance, instead of writing:
for (let key in obj) {
// do something
}
We write:
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
// do something
}
}
No Function Constructor
We shouldn’t use the Function
constructor for creating functions.
The code is in a string, which means we can’t analyze or optimize it.
And it’s also a security risk.
So instead of writing:
let multiply = new Function('a', 'b', 'return a * b');
We write:
let multiply = (a: number, b: number) => a * b
Use of Labels
Labels are only meant to be used with do
, for
, while
, or switch
statements.
They’re used with break
or continue
to control loops.
For instance, we write:
A:
while (foo) {
if (bar) {
continue A;
}
}
We labeled the loop with A
.
Then we used continue
on it, which is run if bar
is true
.
Don’t Use argument Properties
We shouldn’t use arguemnt.callee
to get the function that calls the function.
It makes optimization impossible.
It’s also disallowed in strict mode.
No async Without await
We shouldn’t use async
without await
.
If there’s no await
, which means we aren’t using any promises in the function.
Then that means we don’t need it.
So instead of writing:
async function f() {
doSomething();
}
We write:
async function f() {
await makeRequest();
}
where makeRequest
is a function that returns a promise.
No Assignment in Conditionals
Assigning values in conditions without comparison or other boolean expressions is probably a mistake.
So we should check for those.
For instance, if we have:”
if (foo == bar ){
//...
}
We should make sure that it’s valid.
No Duplicate super Calls
In a subclass’s constructor
, we only need to call super
once.
If we call it more than once, we’ll get an error.
For instance, instead of writing:
class Foo extends Bar {
constructor() {
super(name);
super(name);
}
}
We write:
class Foo extends Bar {
constructor() {
super(name);
}
}
No Duplicate Switch Cases
We should never have more than one case
statement with the same value in a switch
block.
Only the first case will be run because of short-circuiting.
For instance instead of writing:
switch (bar) {
case 1:
return 'foo';
case 1:
return 'bar';
case 2:
return 'baz';
}
We write:
switch (bar) {
case 1:
return 'foo';
case 2:
return 'baz';
}
No Duplicate Variable
We should never have duplicate variables in our code.
var
declarations can have duplicates that aren’t picked by the JavaScript interpreter.
So we make sure that we don’t have things like:
var a = 1;
var a = 2;
We should remove one of them, or better yet, use let
or const
instead of var
.
Conclusion
We shouldn’t have duplicate var
declarations or case
blocks.
Curly braces help with delimiting blocks.
await
should only be used with promises.
One reply on “JavaScript Best Practices — No Useless Syntax”
Nice, lots of little tricks here about JavaScript that can be avoided with smart code.