Let and Const

Before ECMAScript 6, JavaScript had only two types of scope—namely, function scope and global scope. (The scope of a variable, as you learned in section, “Using Functions,” depends on whereabouts in the code the variable was declared using the var keyword.)

To the frustration of many developers coming to JavaScript from other languages, JavaScript lacked a so-called block scope, defining that a variable is only accessible within the block in which it’s defined. (A block is everything inside a pair of curly braces.)

The new keyword let allows you to declare a variable while limiting its scope to the block, statement, or expression on which it is declared.

The var keyword, in contrast, defines a variable either globally or locally to an entire function, taking no account of block scope:

function myFunc() {
{
let x;
if(y == 0)
{
// this is ok, x has block scope
let x = "inner";
}
// this is an error, x already declared in block
let x = "outer";
}
}                     
                     

The const declaration creates a constant—that is, a read-only named variable. The value of a constant cannot change through reassignment, nor can a constant be redeclared later.

function myFunc() {
{
const x = "foo";
// this is an error, x is constant, can't be re-defined
x = "bar";
}
}                     
                     

---

Try it Yourself: Checking Out const

Let’s have a look at how const operates. At the time of writing, it works in most browsers, but I’m going to use Google Chrome.

Instead of writing code in a text file, open the JavaScript Console for your browser. In the case of Chrome, I can do that with Ctrl+Shift+J as shown in this snapshot.

First, define a constant using the const keyword. You can call it anything you like and choose any value. Mine is called MYCONST and I’ve given it a value of 10

The console issues undefined because the declaration of a const does not return a value. In below snapshot. I try to redefine the value of MYCONST.

As you can see, the constant MYCONST couldn’t be reassigned a new value. Let’s try to re-declare it instead

Nope, we can’t do that either. Finally, let’s try to reinitialize it

JavaScript throws an error. Values declared using the const keyword, as we can see, cannot be reinitialized, re-declared, or reassigned.

• JAVASCRIPT TEMPLATE STRINGS ↓

  Template strings provide help in constructing strings and are similar to string interpolation features in some other programming languages such as Perl and Python (among others).

  var name = "John";
  var course = "Mathematics III";
  var myString = 'Hello ${name}, welcome to ${course}.';                     
                       

  You can substitute more complex expressions too:

  var total = 20;
  var tax = 4;
  msg = 'Total is ${total} (or ${total + tax}, including tax)';
  alert(msg);