New JavaScript Elements
Let’s learn about important new elements that have been introduced to JS in ECMAScript 2015+, also known as ES6.
Block-scope variable declarations
ES5 didn’t allow variables delimited by a pair of curly braces, {
and }
, to be declared or defined by a for
loop. Rather, all variables declared with var
, even if declared within a block, have either a function scope or a global scope. The new feature of block-scope variable declarations with let
and const
allows the declaration of local variables with a finer-grained scope. Ultimately, this new feature helps avoid unintended variable duplications and leads to more modular code.
There’s only one difference in meaning between let
and const
. Variables declared with const
are frozen or immutable and, in this sense, remain constant while let
variables are not. It’s preferable to use const
for all variables that aren’t supposed to have changes in their values. It’s not always clear (or known) if variables will change in value. Usually, let
is used to declare block-scoped variables, and var
is used to declare global or function-scoped variables.
Arrow functions
Compared to classical JS functions, arrow functions (=>
) provide a more concise function expression syntax, which can be seen in “Example 1” below. Arrow functions also allow the use of JavaScript’s this
variable from the function’s outer environment (or closure) in their function body, which we’ll see in “Example 2.”
Example 1
Get hands-on with 1400+ tech skills courses.