ES6 Sampler #1 (let & const).

September 16, 2016


JavaScript

Preface

I’ve been using es6 more and more these days, I am also about to jump into typescript, while it is an interesting time to be a developer, it is also a little challenging to be juggling 3 (4 if you include Jquery) syntaxes for javascript, so in an effort to cement the knowledge I would like to do a few es5 to es6 code snippets before moving on.

Note: Are you confused by the terminology ? I sure was, check out this post that explains it all:

• ES5, ES6, ES2016, ES.Next: What’s going on with JavaScript versioning?

TL;DR:    es5 = The Past/Present   es6 === es2015 = The Bleeding Edge/Future

Challenges: I gave myself little challenges you are welcome to try if you want to recreate my own learning curve.

Variables (Let & Constant)

Note: Technically, the following are statements and declarations, but you'd be surprised how many people (including myself) call them variables or variable types from time to time

I guess the first thing to look into is variables, what kind of new magic variables does es6 add and when to use them ?

Challenge: Learn and use the new es6 statement let

See the Pen ES6 Sampler - let by Eugenio - Keno - Leon (@k3no) on CodePen.

As I understand it, let brings block scoping to Javascript, or in other words makes variable declaration less loosey goosey since now ( if you use let), you can make sure variables stay within your functions.

Constants

Another type of variable or declaration new to Javascript, is the Constant, let’s try using it:

Challenge: Learn and use the new es6 declaration constant   ...extra challenge: Equivalent in es5 ?

See the Pen ES6 Sampler - const by Eugenio - Keno - Leon (@k3no) on CodePen.

TL;DR: let is the new var; there are now constants in Javascript

Extra Credits: What is block scoping and variable hoisting ?...How do they work with let and Const ?

Of course there is more nuance to using let and const,(Check the docs if you get stuck), but this being a sampler, I hope at least you consider starting to use let and const ( with babel for now : mid-late 2016) in your projects.

Best,

Keno