
My two most used ES6 features: const & let, & arrow functions
Posted on
3 min read
•0 views
ES6 brought a whole load of convenient feature to JavaScript. I’m going to talk about the two I use the most.
const and let
Before ES6 variables were declared with the var
keyword like
var a = "Hello World!";
With ES6 there are two new ways to declare variables, which are const
and let
.
const a = 10;
let b = 5;
let
is the closest to var
as in they both allow the variable to be reassigned. const
makes the variable immutable which means a new value cannot be assigned to that variable.
When I write code, my default is to always use const
, because it makes my code more predictable especially when the file is long. I only use let
when I need the variable to hold a new value further along in the code, which is rare for me. If I had to give a ratio to the const
vs let
declarations I do, I’d say it would be around 20:1. In 3+ years of coding in JavaScript I have never used var
.
Arrow functions
Normally in JavaScript we use the function
keyword to declare a function
function add(a, b) {
return a + b;
}
add(1, 2); // 3
With arrow functions the same function would look like
const add = (a, b) => {
return a + b;
};
add(1, 2); // 3
Note you can assign an arrow function to let
or var
too but it’s always better to assign it to const
.
Arrow functions also allows for implicit return, so the same function can be shortened to
const add = (a, b) => a + b;
add(1, 2); // 3
I found the implicit return of arrow functions specially useful when developing in React as it helps cut down the code written by quite a bit.
Wrapping up
ES6 also has lots of other great features like object destructing, but I’m at a point now where I could not imagine coding JavaScript without the two I just talked about. If you don’t use these already, give them a try and check out the rest of ES6 as well. It’ll make coding in JavaScript a whole lot easier and fun. I might talk const
& let
, & arrow functions in detail in the future (I’m itching to talk about the whole this
and bind
mess in JavaScript and how arrow functions solve it).