Categories
JavaScript Best Practices

JavaScript Best Practices — Robust Code

Spread the love

=referral)

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.

Use Factory Functions

Factory functions are functions that aren’t a constructor function but return an object.

We can use this to return objects our way.

It’s useful if we don’t need inheritance while letting us create objects from a function.

For example, we can write:

function createDog(name) {
  const children = []

  return {
    addChild(dog) {
      children.push(dog)
    },
  }
}

Then we can create a dog object with:

const james = createFrog('james')

The object returns a function doesn’t reference this and it’s not an instance of any constructor.

Factory functions are reusable and can be composed.

Add Instance Methods on the prototype Property When Writing Constructors

If we want to add instance methods to a constructor function, we should add them to the prototype property of the function.

For instance, we can write:

function Dog(name) {
  this.name = name
}

Dog.prototype.speak = function() {
  console.log(this.name)
}

This is better than putting the method inside the constructor as the property of this because only one copy of the function will be shared between all instances.

This is different from:

function Dog(name) {
  this.name = name
  this.speak = function() {
    console.log(this.name)
  }
}

which creates a new speak method for instance of Dog .

Each copy takes more memory so it’s less efficient.

Use the type Property to Differentiate

We can differentiate something with the type property.

For instance, we can write:

function createSpecies(type, name, gender) {
  if (type === 'dog') {
    return createDog(name, gender);
  } else if (type === 'cat') {
    return createCat(name, gender);
  } else {
    throw new Error('invalid type');
  }
}

We can create different objects based on the value of type .

This is conventional so that it won’t confuse people.

Use TypeScript

TypeScript is an extension of JavaScript created by Microsoft to solve problems with restricting types in JavaScript code.

It’s very useful since it lets us restrict types and provide type definitions to do type checks and autocompletion.

It compiles down to JavaScript versions as early as ES3.

We can define interfaces that aren’t available in JavaScript.

This lets us restrict implementations to something standard.

Variables, parameters, and function return values can have their own types.

It also provides syntax which isn’t available in JavaScript like defining class variables outside class methods.

Therefore, TypeScript is definitely worth considering for moderately to large-sized projects.

Write Tests

Tests let us test our code automatically.

This makes testing much faster and less error-prone.

It also checks for regressions so it’s harder to make regressions when we change existing code.

There’re many things that let us do this easily.

Keep Functions as Simple as Possible

Simple functions are easy to test, change, and understand.

Therefore, we should keep them as simple as possible.

It’ll reduce lots of headaches.

Conclusion

We can write robust code with a few changes to our programming workflow.

We can write tests, use TypeScript, and add prototype methods.

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 *