Javascript let, var and const

ES6 determination presented two better approaches for declaring variables in JavaScript with let and const keyword. First, let's take a look of this table below.

Keyword	const	Let	var
Global Scope	no	no	yes
Function Scope	yes	yes	yes
block scope	yes	yes	no
can be reassigned	no	yes	yes

VAR

Before ECMAScript6 , var declarations runs as ruler. There are issues related with variables declared with var. That is the reason it was necessary for better approaches to declare variables to develop. First, let us get the chance to comprehend var more before we discuss one of such issues.

Scope of var

Scope essentially means where these variables are available for use. The var declarations are globally scoped or function/locally scoped. It is globally scoped when a var variable is declared outside a function. This means that any variable that is declared with var outside a function block is available for use in the whole window. var is function scoped when it is declared within a function.

To understand further, look at the example below.

var greet = "Hello World"; 

function greetMe() {
    var hello = "Hey Sept!"; // this is function scope 
}
console.log(hello); // get an error: hello is not defined

We'll get an error because the variable hello is not available outside the function.

var variables can be re-declared and updated

That means we can do this within the same scope and won't get an error.

var greeter = "hey sept!";
var greeter = "say Hello sept!";
console.log(greeter) // output will be 'say Hello sept!'

// and this also 

var myName = "Ocram";
myName = "Marco";
console.log(myName) // output will be 'Marco'

LET

let is the improve version to the var declarations. It is preferred for variable declaration now. Let's consider why this is so.

let allows you to declare variables that are limited to a scope of a block statement, or expression on which it is used, unlike the var keyword, which defines a variable globally, or locally to an entire function regardless of block scope.

Scope of let

Variables declared by let have their scope in the block for which they are defined, as well as in any contained sub-blocks. In this way, let works very much like var. The main difference is that the scope of a var variable is the entire enclosing function:

Example:

function varTest() {
  var x = 1;
  {
    var x = 2;  // same variable!
    console.log(x);  // 2
  }
  console.log(x);  // 2
}

function letTest() {
  let x = 1;
  {
    let x = 2;  // different variable
    console.log(x);  // 2
  }
  console.log(x);  // 1
}

At the top level of programs and functions, let, unlike var, does not create a property on the global object. For example:

var x = 'global';
let y = 'global';
console.log(this.x); // "global"
console.log(this.y); // undefined

CONST

To create and initialize a read-only variable that holds a steady value and something we can never alter, we will use const keyword. In ES6, "const," like the let keyword, will have block scoping. A constant's value can not be changed by reassignment, and it can not be redeclared. A constant can not share its name within the same scope with a function or variable.

Another source of const definition from MDN

The const declaration creates a read-only reference to a value. It does not mean the value it holds is immutable, just that the variable identifier cannot be reassigned.

Example:

const number = 42;

try {
  number = 99;
} catch(err) {
  console.log(err);
  // expected output: TypeError: invalid assignment to const `number'
  // Note - error messages will vary depending on browser
}

console.log(number);
// expected output: 42

Thank you so much for giving time to read.😄 Hope you learn something.