Scopes and declaration of variables with var, let and const in JavaScript

In JavaScript there are two main scopes where to locate the variables, and these scopes determine the accessibility to these variables:

* global
* local: no están accesibles desde el scope global

A variable in a global scope is the one that is declared outside a block, example:

// A global variables
var vehicle = 'motorcycle'

And a variable in a local scope is the one that is created within a function.We can create a variable within a function that being a local variable is in another scope other than the global, and call it the same as the global variable, but they are different variables as we can see by running the following example:

// Three global variable
var vehicle = 'motorcycle'
let brand = 'BMW'
const pvp = 1000

var isPetrol = true

// A function
function move() {

  // Three local variable
  var vehicle = 'car'
  let brand = 'Fiat'
  const pvp = 2000
  
  // block into function
  if (isPetrol) {
    // Reassigns to the variable 'vehicle' of the global scope another value: for declaring itself as 'var'
    var vehicle = 'tractor'
    // A block variable
    let brand = 'Lamborgini'
  
    console.log('In block at function: The vehicle is a ' + vehicle + ' and its brand ' + brand);
  }
  
  console.log(vehicle)
  console.log(brand)
  console.log(pvp)
  
}

console.log(vehicle)
console.log(brand)
console.log(pvp)

move()

console.log(vehicle)
console.log(brand)
console.log(pvp)

// A block
if (isPetrol) {
  // Reassigns to the variable 'vehicle' of the global scope another value: for declaring itself as 'var'
  var vehicle = 'truck'
  // A block variable
  let brand = 'Renault'
  
  console.log('In block: The vehicle is a ' + vehicle + ' and its brand ' + brand);
}

console.log('In main: The vehicle is a ' + vehicle + ' and its brand ' + brand);

This execution returns:

motorcycle
BMW
1000
car
Fiat
2000
motorcycle
BMW
1000
In block: The vehicle is a truck and its brand Renault
In main: The vehicle is a truck and its brand BMW

The 'console.log' that are not within the function, and that are what are called top-level function, access the 'vehicle' variable of the global scope, but not the local scope of the 'move' function.

Local variables are divided into several types:

* function-scoped: son las variables declaradas dentro de una función
* block-scoped: son las variables declaradas dentro de estructuras de control como if, while, for y similares. Se declaran sólo con let y const, no con var.

The difference between var and let is explained below: there is a global variable declared with 'let' called 'brand' in the main block, and when another variable with the same name is declared within a block 'brand' with 'let' it is a new variable in another scope, it does not reassign the new value in the global scope variable because it is another variable. However in the case of the variable declared in the block with 'var' and the name 'vehicle' for JavaScript it is not another variable with the same name in the local scope of the block: JavaScript in this case tries to create a new variable, and It does not give an error, but it modifies the value of the variable with the same name in the global scope. This can be checked both in the 'if' block of the function and in the 'if' block outside the function.

Variables declared with 'const' cannot be reassigned their value.

One thing to note: the global context according to the scope of execution (a browser, nodejs, etc.) are specific components, but it is the global scope.