Categories
Modern JavaScript

The Best Features of JavaScript to Date

Spread the love

JavaScript has improved immensely as a language. Now we can actually use it as a general-purpose programming language.

In this article, we’ll look at the best feature of JavaScript to date.

let and const

Without question, let and const let us create variables without hassle unlike var or declaring variables with no keywords.

let lets us declare block-scoped variables.

const lets us declare block-scoped constants that can’t be reassigned a new value.

This is good since now we don’t have to worry about function scoped variables with var and hoisting.

We’ll get an error if we declare constants with const and try to reassign it.

Arrow Functions

Arrow functions are great. They let us create functions that can only be used after they’re defined.

With it, we don’t have to worry about the value this inside the function.

We just have to worry about what we do with the function.

It’s also shorter. We can define it with the following code:

const subtract = (a, b) => a - b;

It’s just easier for us to deal with when we’re writing callbacks.

this is inherited from the outside, so it’s perfect for nested functions and callbacks.

For instance, if we have the following:

class Timer {
  startTimer() {
    this.foo = 'foo';
    setInterval(() => console.log(this.foo), 1000)
  }
}

Then we see foo logged in the console every second since this.foo ‘s value is 'foo' , and the arrow function callback takes this straight from the outside.

Class Syntax

Writing constructor functions is hard, especially if we need to have instance methods and inheritance.

The class syntax solves the issues with the confusing constructor syntax.

Instead of writing constructor functions as follows:

function Person(name) {
  this.name = name;
}

Person.prototype.greet = function(greeting) {
  return `${greeting} ${this.name}`
}

We write:

class Person {
  constructor(name) {
    this.name = name;
  }

  greet(greeting) {
    return `${greeting} ${this.name}`;
  }
}

It’s much cleaner than the old constructor syntax since we don’t have to add methods to the prototype property of the object.

Promises / Async functions

Promises become a built-in feature of JavaScript since ES2015. It’s great because we can use it to write complex async code without nesting callbacks everywhere.

All we have to do is to return promises in and call then to chain promises to write our serial async code.

For instance, we can have:

Promise.resolve(1)
  .then(() => Promise.resolve(2))
  .then(() => Promise.resolve(3))

Async functions make things even shorter and they do the same thing as chaining promises.

For instance, we can shorten the code above to:

(async () => {
  await Promise.resolve(1);
  await Promise.resolve(2);
  await Promise.resolve(3);
})()

We reduce nested by eliminating the callback. All lines return the resolved value of each promise.

So if we have:

(async () => {
  const val = await Promise.resolve(1);
  console.log(val);
})()

We get 1 for val since that’s its resolved value.

The code above is the same as:

Promise.resolve(1)
  .then(val => console.log(val));

async functions can also return a value, which will return a promise that resolves to that value.

So if we write:

(async () => {
  return 1;
})()

We get that 1 is the resolved value of the promise returned by that function.

Modules

Modules are great since they replace script tags. Script tags weren’t good because they’ve to be loaded in order and variables and functions are called out of nowhere.

It’s been a built-in feature since ES2015.

We can import the items from modules and use them instead. Then we know where everything comes from.

Also, we can hide items without wrapping them in functions and returning what we want.

This is much more convenient than ordering script tags and having long functions when we create a big app.

With modules, we can organize code as we do in most other programming languages.

Conclusion

JavaScript has improved a lot. If we didn’t use then features listed above in our app, then we should use them now.

There is just no way that we can live without these features which are in many programming languages before they made it to JavaScript.

We got to use them wherever we can and make all new JavaScript projects incorporate these features.

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 *