Javascript let Keyword

In JavaScript, let is a keyword that is used to declare a local variable with block scope. In ECMAScript2016(ES6) the let keyword was introduced to define local scope variables.

It allows you to declare a limited scope variable that is not accessible outside of the scope.

It is recommended to use the let keyword while creating a variable in JavaScript unless you have a specific use case for a global scope variable.

Syntax for using `let` Keyword

The syntax for using the let keyword for defining a variable is the same as that for the var keyword.

let someVar = 10;

You can also create multiple variables together, like this,

let someVar1=20, someVar2=10;

In the above code example, we have created two variables and assigned them values too. If you want you can just create the variables and assign them values later, like this,

let someVar1, someVar2;
someVar1 = 10;
someVar2 = 20;

Let's see some more code examples.

Using `let` inside a code block

JavaScript variable declared inside a block {} can not be accessed from outside the block, if the variable is defined using the let keyword. See the below example:

{
    let x = 2;
}

alert(x)  // not accessible

uncaught ReferenceError: x is not defined

In the above example, the variable is accessible only inside the block. See the below example, to see that:

{
    let x = 2;
    alert(x)  // accessible
}

Use `let` inside a Loop

When you run a simple loop in JavaScript, you have to use a counter variable to control the loop, you should always create the loop's counter variable using the let keyword. So, the variable does not conflict with the code written outside the loop. See the below example:

let i = 5;

for(let i = 0; i < 10; i++) {
  	// code
}

alert(i);  // print 5

As you can see in the output it shows 5, even though the loop incremented the value of i variable up to 10, that is because the local variable i will be destroyed once the for loop ends. Hence, the variable i accessed in the alert() is the variable created on line number 1 in the code.

Use `let` inside a Function

As we know, let keyword declares the local scope variable. So a variable declared inside the function will remain within the function scope.

If we will try accessing such variables from outside the function, we will get an error. See the below example:

function show() {
    let amount = 2500;   // Function Scope
}
alert(amount) // not accessible

Uncaught ReferenceError: amount is not defined

Now, if you are thinking that is correct behavior because a variable created inside a function should not be accessible outside of the function. Well, try running the same code with the var keyword instead of the let keyword.

JavaScript `let` vs `var` Keyword

We have already covered the difference in the introduction, but let's see some code examples to see the difference between let and var keyword.

The let and var, both keywords are used to declare variables, but the main difference is the scope of the declared variables.

A variable declared inside a block using var is accessible outside of the block as it has a global scope but a variable declared using the let keyword has a local scope. Let's see an example:

{
    let amount = 2500;   // block Scope
    var withdraw = 2000;    // global scope
}
console.log(withdraw)   // accessible
console.log(amount)   // not accessible

2000
Uncaught ReferenceError: amount is not defined