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.