Like any kind of apps, JavaScript apps also have to be written well.
Otherwise, we run into all kinds of issues later on.
In this article, we’ll look at some best practices we should follow when writing JavaScript code.
No Mixing Spaces and Tabs for Indentation
Mixing spaces and tab for cause issues for text editors.
Therefore, we shouldn’t mix them.
Instead, we use 2 spaces and convert tabs to 2 spaces automatically.
No Multiple Spaces Except for Indentation
We only use 2 spaces for indentation.
In all other locations, we should use one space to avoid wasting space.
No new Without Assigning the Return Object to a Variable
If we create a new object with new
, then we should assign it to a variable so we can use it.
For instance, instead of writing:
new Dog();
We write:
const dog = new Dog();
Don’t Use the Function Constructor
We shouldn’t use the Function
, it takes strings for the function code and returns a function.
It’s a security hazard to run code in strings.
Also, it’s hard to debug and optimize since the code it’s in a string.
For instance, we shouldn’t write:
const add = new Function('a', 'b', 'return a + b');
Instead, we write:
const add = (a, b) => a + b;
Don’t Use the Object Constructor
We shouldn’t use the Object
constructor since it doesn’t give us benefit over the create them with object literals.
It just makes the code longer.
For example, instead of writing:
let foo = new Object();
We should write:
let foo = {};
No new with require
We shouldn’t have new
and require
together.
It may create confusion between:
const foo = new require('foo');
and:
const foo = new (require('foo'));
Therefore, we should avoid these expressions.
Don’t Symbol as a Constructor
Symbol
is a factory function. It’s not a constructor.
Therefore, we shouldn’t write:
const foo = new Symbol('foo');
Instead, we write:
const foo = Symbol('foo');
No Primitive Wrapper Instances
We shouldn’t use functions like String
or Boolean
as constructors.
This is because they return values of type 'object'
, which is confusing.
Also, the code is longer.
Therefore, we shouldn’t use it.
For instance, instead of writing:
const message = new String('hi');
We write:
const message = 'hi';
Literals are shorter and eliminate any confusion that can arise.
Don’t Call Global Object Properties as Functions
We shouldn’t call global object properties as functions.
They aren’t mean to be called.
For instance, we shouldn’t write:
const math = Math();
No Octal Literals
We shouldn’t write octal number literals.
They are almost never useful in JavaScript and since they start with a 0, we may confuse it with decimal numbers.
For instance, we shouldn’t write:
const octal = 042;
Instead, we write:
const decimal = 34;
No Octal Escape Sequences
We shouldn’t have octal escape sequences in our code.
They aren’t useful and it’s probably a mistake to have them.
For instance, we shouldn’t write:
const foo = 'foo 251'
Instead, we write:
const foo = 'foo';
No String Concatenation When Using __dirname or __filename
We should use path.join
to join paths so that we can use the path in all operating systems correctly.
For instance instead of writing:
const pathToFile = __dirname + '/foo.js'
We write:
const pathToFile = path.join(__dirname, 'foo.js')
Don’t Use proto
The __proto__
property isn’t mean to be accessed directly as indicated by the __
characters.
Instead, we should use the Object.getPrototypeOf
method to get the prototype of an object.
So we shouldn’t write:
const foo = obj.__proto__;
But we should write:
const foo = Object.getPrototypeOf(obj);
Don’t Redeclare Variables
We shouldn’t redeclare variables in our code.
We’ll get an error if we declare 2 variables with the same name in the same scope.
Instead, we should reassign a new value to the existing variable with the same name.
For example, instead of writing:
let name = 'james';
let name = 'joe';
We write:
let name = 'james';
name = 'joe';
Conclusion
We shouldn’t declare variables with the same name in the same scope.
Also, we should use getPrototypeOf
method to get the prototype of an object.
We should also be mindful when spacing out our JavaScript code.