Categories
JavaScript Best Practices

JavaScript Best Practices — Spaces, Objects, and Strings

Spread the love

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.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *