Scope in JS ( or in other languages as well) determines the accessibility/availability of variables and functions at various parts of someone’s code.

In general terms, the scope will let us know at a given part of code, what are variables and functions we can or cannot access.

There are three types of scopes in JS:

  • Global Scope
  • Local or Function Scope
  • Block Scope

Global Scope

Variables or functions declared in the global namespace have global scope, which means all the variables and functions having global scope can be accessed from anywhere inside the code.

var globalVariable = "Hello world";

function printVar(){
return globalVariable; // can access globalVariable since it's written in global space
}
function printvarAgain(){
return printVar(); // Can access printVar function since it's written in global space
}
printvarAgain(); // Returns “Hello world”

Function Scope

Any variables or functions declared inside a function have local/function scope, which means that all the variables and functions declared inside a function, can be accessed from within the function and not outside of it.

function multiply(){
var a = 2;

var multiplyBy2 = function(){
console.log(a*2); // Can access variable "a" since a and multiplyBy2 both are written inside the same function
}
}
console.log(a); // Throws reference error since a is written in local scope and cannot be accessed outside

multiplyBy2(); // Throws reference error since multiplyBy2 is written in local scope

Block Scope

Block scope is related to the variables declared using let and const. Variables declared with var do not have block scope. Block scope tells us that any variable declared inside a block { }, can be accessed only inside that block and cannot be accessed outside of it.

{
let x = 45;
}

console.log(x); // Gives reference error since x cannot be accessed outside of the block

for(let i=0; i<2; i++){
// do something
}

console.log(i); // Gives reference error since i cannot be accessed outside of the for loop block

Scope Chain

JavaScript engine also uses scope to find variables.

Scope chain establishes the scope available for a given function. Each defined function has its own scope, and if any function is defined within first function, then it has a local scope which is linked to the outer function.
This chaining of the scope is called the Scope chain.

var y = 24;

function firstfunc(){
var x = 667;
var secondfunc = function(){
console.log(x); // Does not find x inside anotherFavFunction, so looks for variable inside favFunction, outputs 667
}

var thirdfunc = function(){
console.log(y); // Does not find y inside yetAnotherFavFunction, so looks for variable inside favFunction and does not find it, so looks for variable in global scope, finds it and outputs 24
}

secondfunc();
thirdfunc();
}
firstfunc();

As you can see in the code above, if the javascript engine does not find the variable in local scope, it tries to check for the variable in the outer scope. If the variable does not exist in the outer scope, it tries to find the variable in the global scope.

If the variable is not found in the global space as well, a reference error is thrown.