Modern JavaScript Basics

What You’ll Learn

In this series, I’ll demonstrate some of the differences and new features added to the JavaScript language between ES5 and ES6, the current stable version. Let’s get started by creating a basic dev environment.

Let and Const

Variables in JavaScript used to consist of just one declaration, var. Now though, they’re split up into two, let and const. In this episode, we’ll discuss why this change was made.

Arrow Functions Point the Way

Now in JavaScript, you can write functions in a completely different way, called arrow notation. What’s even better is that if your function only has a single return value, you can reduce your entire functions declaration and body to just one line.

Class is in Session

If you wanted to use OOP practices in JavaScript before ES6, you’d have to do something pretty hacky with functions and prototypes. Now though, classes are standard in the language and a breeze to work with.

Promises are Made

JavaScript is typically a synchronous language, where processes wait to finish up before executing following parts of the code. Using promises though, you can include asynchronous calls and execute code whenever they finish up.

Async and Await

Fresh off the topic of Promises, async and await are also two more methods to include asynchronous patterns in your JavaScript code. Using the await keyword inside of async functions lets you pause execution until a promise is resolved.

Maps and Sets are Special Objects

Usually when working with sets of data in JavaScript, you’re either using arrays or objects. However, ES6 introduced two new special objects to use, maps and sets, both of which come with their own methods, use cases, and limitations.

Declarative Methods

You might have heard the term “Declarative Programming” before, but if you haven’t, it’s a way of writing code that explains what data you’re retrieving instead of how. Using these modern JavaScript methods helps you do just that, and improves your code readability.

Demystifying Modules

Modules have been around for a while now in JavaScript, but up until recently you’ve had to use a bundler like Webpack to include them in your source code. Now, modern browsers can handle importing and exporting methods and attributes natively.

Wrapping It All Up

And we’re done! Over the last nine episodes, you’ve learned about the new features that ES6 JavaScript has to offer. So, where could you go from here? The language and tooling is constantly evolving, and there are many paths to choose from.