Skip to main content

JavaScript Let

 

let

 

The let keyword was introduced in ES6 (2015).

Variables defined with let cannot be Redeclared.

Variables defined with let must be Declared before use.

Variables defined with let have Block Scope.

Cannot be Redeclared

Variables defined with let cannot be redeclared.

You cannot accidentally redeclare a variable.

With let you can not do this:

Example

let x = "John Doe";

let x = 0;

// SyntaxError: 'x' has already been declared

With var you can:

Example

var x = "John Doe";

var x = 0;

Block Scope

Before ES6 (2015), JavaScript had only Global Scope and Function Scope.

ES6 introduced two important new JavaScript keywords: let and const.

These two keywords provide Block Scope in JavaScript.

Variables declared inside a { } block cannot be accessed from outside the block:

Example

{
  let x = 2;
}
// x can NOT be used here

Variables declared with the var keyword can NOT have block scope.

Variables declared inside a { } block can be accessed from outside the block.

Example

{
  var x = 2;
}
// x CAN be used here

Redeclaring Variables

Redeclaring a variable using the var keyword can impose problems.

Redeclaring a variable inside a block will also redeclare the variable outside the block:

Example

var x = 10;
// Here x is 10
{
var x = 2;
// Here x is 2
}

// Here x is 2

Redeclaring a variable using the let keyword can solve this problem.

Redeclaring a variable inside a block will not redeclare the variable outside the block:

Example

let x = 10;
// Here x is 10
{
let x = 2;
// Here x is 2
}

// Here x is 10 
 

Redeclaring

Redeclaring a JavaScript variable with var is allowed anywhere in a program:

Example

var x = 2;
// Now x is 2
var x = 3;
// Now x is 3

With let, redeclaring a variable in the same block is NOT allowed:

Example

var x = 2;    // Allowed
 let x = 3;    // Not allowed
{
let x = 2;    // Allowed
 let x = 3     // Not allowed
 }

{
let x = 2;    // Allowed
 var x = 3     // Not allowed
 }

Redeclaring a variable with let, in another block, IS allowed:

Example

let x = 2;    // Allowed

{
let x = 3;    // Allowed
 }

{
let x = 4;    // Allowed
 }

Let Hoisting

Variables defined with var are hoisted to the top and can be initialized at any time.

Meaning: You can use the variable before it is declared:

Example

This is OK:

carName = "Volvo";
var carName;

If you want to learn more about hoisting, study the chapter JavaScript Hoisting.

Variables defined with let are also hoisted to the top of the block, but not HTML initialized.

Meaning: Using a let variable before it is declared will result in a ReferenceError:

Example

carName = "Saab";
let carName = "Volvo";
 
Labels:

Comments

Post a Comment

Popular posts from this blog

JavaScript Const

  The const keyword was introduced in ES6 (2015) . Variables defined with const cannot be Redeclared. Variables defined with const cannot be Reassigned. Variables defined with const have Block Scope. Cannot be Reassigned A const variable cannot be reassigned : Example const PI = 3.141592653589793 ; PI = 3.14 ;      // This will give an error PI = PI + 10 ;   // This will also give an error Must be Assigned JavaScript const variables must be assigned a value when they are declared: Correct const PI = 3.14159265359 ; Incorrect const PI; PI = 3.1 4159 265359 ; When to use JavaScript const? As a general rule, always declare a variable with const unless you know that the value will change. Use const when you declare: A new Array A new Object A new Function A new RegExp Constant Objects and Arrays The keyword const is a little misleading. It does not define a constant value. It def...
Post a Comment
Read more

JavaScript Introduction

    This page contains some examples of what JavaScript can do. JavaScript Can Change HTML Content One of many JavaScript HTML methods is getElementById() . The example below "finds" an HTML element (with id="demo"), and changes the element content (innerHTML) to "Hello JavaScript": Example document. getElementById ( "demo" ). innerHTML = "Hello JavaScript" ; JavaScript accepts both double and single quotes: Example document. getElementById ( 'demo' ). innerHTML = 'Hello JavaScript' ; JavaScript Can Change HTML Attribute Values In this example JavaScript changes the value of the src (source) attribute of an <img> tag:   JavaScript Can Change HTML Styles (CSS) Changing the style of an HTML element, is a variant of changing an HTML attribute: Example document. getElementById ( "demo" ). style . fontSize = "35px" ; JavaScript Can Hide HTML Elements Hidin...
Post a Comment
Read more

JavaScript Variables

  4 Ways to Declare a JavaScript Variable: Using var Using let Using const Using nothing   What are Variables? Variables are containers for storing data (storing data values). In this example, x , y , and z , are variables, declared with the var keyword: Example var x = 5 ; var y = 6 ; var z = x + y; In this example, x , y , and z , are variables, declared with the let keyword: Example let x = 5 ; let y = 6 ; let z = x + y; In this example, x , y , and z , are undeclared variables: Example x = 5 ; y = 6 ; z = x + y; From all the examples above, you can guess: x stores the value 5 y stores the value 6 z stores the value 11 When to Use JavaScript var? Always declare JavaScript variables with var , let , or const . The var keyword is used in all JavaScript code from 1995 to 2015. The let and const keywords were added to JavaScript in 2015. If you want your code to run in older browser, you must use var . When to Use JavaScri...
Post a Comment
Read more