Categories
JavaScript Best Practices

JavaScript Best Practices — Paths, Numbers, and Operands

Spread the love

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 Negating the Left Operand in in Expressions

Forgetting to negate the whole in expression is a mistake.

Negating the left operand will negate nothing else.

For instance, don’t write:

if (!key in object) {
  //...
}

We write:

if (!(key in object)) {
  //...
}

to negate the whole expression.

No Nested Ternary Expressions

Nested ternary expressions are hard to read, so we shouldn’t use them/

For instance, we shouldn’t write:

const foo = bar ? baz : qux === quxx ? abc : baz;

We should just write if statements to replace it:

if (foo) {
  thing = bar;
} else if (baz === qux) {
  thing = abc;
} else {
  thing = baz;
}

No Using new For Side Effects

We shouldn’t use new for side effects.

So we shouldn’t write:

new Animal();

Instead, we write:

const animal = new Animal();

We assign the returned value to a variable so we can use it.

No Function Constructor

The Function constructor takes string arguments for creating functions.

It’s hard to optimize the code because of that, and we don’t want to let anyone pass strings to it.

Instead of writing:

const add = new Function("a", "b", "return a + b");

We write:

const x = (a, b) => {
  return a + b;
};

No Object Constructors

Object constructors shouldn’t be used.

They don’t bring any benefit and it’s longer to write.

For instance, instead of writing:

const obj = new Object();

We write:

const obj = {};

No new require

We shouldn’t use new and require together.

Instead, we separate them to remove confusion between:

const foo = new require('foo');

and

const foo= new require('foo');

So instead of writing those, we write:

const Foo = require('foo');
const foo = new Foo();

No Symbol Constructor

The Symbol function isn’t a constructor.

We call it directly to create a symbol.

So instead of writing:

const foo = new Symbol("foo");

We write:

const foo = ymbol("foo");

No Primitive Wrapper Instances

We shouldn’t use primitive wrappers to create primitive values.

They have the object types instead of the usual primitive types.

There’s no benefit to using them.

If primitive values need to be wrapped into objects, then it’ll be done temporarily automatically.

So instead of writing:

const stringObject = new String("hello");

We write:

const str = "hello";

No Calling Global Object Properties as Functions

We shouldn’t call global object properties as functions since they aren’t functions.

For instance, we shouldn’t have code like:

const math = Math();

const newMath = new Math();

const json = JSON();

const newJSON = new JSON();

const reflect = Reflect();

Instead, use their properties:

const obj = JSON.parse("{}");

const value = Reflect.get({ x: 1, y: 2 }, "x");

const pi =  Math.PI;

No Octal Literals

We shouldn’t have numbers that start with a zero.

They’re treated as octal literals.

For instance, instead of writing:

const num = 071;

is actually 57 in decimal.

So we should write:

const num = 71;

instead.

No Octal Escape Sequences in String Literals

Octal escape sequences in string literals are deprecated in ES5, so they shouldn’t be used.

So we shouldn’t write:

const foo = "hello \251";

Instead, we write:

const foo = "hello \xA9";

No Reassignment of Function Parameters

We shouldn’t reassign function parameters to a new value.

They mutate the argumenrts objects and also the variable itself if they’re objects.

So instead of writing;

function foo(bar) {
  bar = 100;
}

We write:

function foo(bar) {
  let baz = 13;
}

No String Concatenation when Using __dirname and __filename

We shouldn’t concatenate those expressions with the rest of the path since they don’t work together properly with all platforms.

So instead of writing:

const fullPath = __dirname + "/foo.js";

const filePath = __filename + "/foo.js";

We write:

const fullPath = path.join(__dirname, "foo.js");

const fullPath = path.join(__filename, "foo.js");

Conclusion

We shouldn’t concatenate paths together.

Instead, we use the path module methods to do so.

Nested ternary expressions are hard to read.

Deprecated expressions should be removed.

And never use octal literals

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 *