ES6 for beginners - part 1 (Let, Const)

I want to present to you the first part of the blog posts series "ES6 for beginners" written by our dev, Bartosz. Next parts coming soon!.

Introduction

In the beginning, I would like to congratulate everyone who has read some of my posts about JavaScript!

Of course, there is nothing to prevent you from starting from here, but I think that understanding the previous parts is much more important than reading about the new features in ES6. However, if you would like to start right away from this place, nothing stands in the way

Topics that I will touch are:

1. let / const
2. arrow functions
3. classes
4. spread operator/rest parameter
5. destructuring
6. array helper methods
7. promises/fetch

Ok, for starters, what ES6 is?

ES6 is basically ECMAScript 6 / ECMAScript 2015. ECMAScript is not any scripting language instead of a standard that Javascript is based upon. So, ES6 is a new version or new standard of JavaScript. ES6 brings many new features like the concept of classes, arrow functions etc. Almost all the modern browsers support ES6 but for the old browsers, there are many transpilers e.g. Babel.js those we need to include at top of our code to transpile ES6 to ES5 (JavaScript with old standards). All of the popular JavaScript libraries and frameworks like Node.js, ReactJS follow ES6.

We will start with something very simple but also very useful. Let and Const.

We all know what the var keyword is. We have used it many times. New variable? var, new Function Expression? var etc. ES6 introduces two additional keywords, which are let and const. This does not mean that var will stop working now, but you are very encouraged to use the new ones.

let

Short, It is really a new var. Let is encouraged to be used everywhere instead of the mentioned var. By everywhere I mean anywhere except when we want to use const (explanation is few lines below). Use let for example if you want to create a simple variable.

As you can see in this example, there is no difference. A logical question now would be, if there is no difference, why was it introduced to JavaScript?

Let's follow another example. Here we can see the function which contains two for loops. The only difference is exactly the var and the let. However, if we want to check the values of I and j in the console, outside the block where the code is executed, we will get two different results.

When var i = 0, our i variable will be visible.

However, if we use let j = 0, our j variable will not be visible.

const

The main reason we want to use the const keyword is when we don't want a variable to be re-declared in later code. For example, I strongly recommend using treat const like an old var and change to let when it is needed. Let's see what will happen when we decide to change the variable that we declared using a const keyword.

Error :)

Of course, it is still possible to use methods such as push etc, but as shown above, any "manual" change of the previously declared value will end with an error.

Our array has been modified.

In the next article, we will discuss another topic from the list: Arrow Functions.

Next Post will be published soon!