saiar2020 ‘Scope and Execution Context in Javascrint | by Vivek | Medium
Open in app. @n
Vivek
19Followers » About Follow
Scope and Execution Context in Javascript
@ Vivek tay 22,2019 - Sminread
One of the most basic and important concepts in javascript is scope and execution
context. We should have better understanding of these concepts to understand the
advanced concepts in javascript. In this post, we will try to demystify these concepts
with popular interview questions.
Scope:
Scope determines the accessibility (visibility) of variables.In JavaScript there are two
types of scope:
* Global scope
* Local scope
Global Scope:
Ifa variable is declared outside all functions or curly braces , it is said to be defined in
the global scope. Variables in global scope can be accessed from everywhere in the
application. Global variables are available for the lifetime of the application.
// Initialize a
var globa
Local Scope:
hitps:sImedium. com! @pvivekdlscope-and-executioncontex-injavascrit-3b7 1e76cd183 19sanar2020 ‘Scope and Execution Context in Javascriot| by Vivek | Medium
Open in app
as any new scope that we create within the global scope. In JavaScript, there are two
kinds of local scope: function scope and block scope.
function local
// LOCAL SCO!
var name = 'xyz";
console.log(name); // Jerry
}
peExample () {
// GLOBAL SCOPE
console.log(name); // Uncaught ReferenceZrror: nameis not defined
Function Scope:
Each function written in JavaScript creates a new local scope. Variables defined in a
function are visible everywhere within the function, but are not visible outside of the
function.
// Global Scope
function functionScopeExamplel() {
/f Local Scope #1
function functionScopefxample2() {
// Local Scope #2
b
}
// Global Scope
function functionScopeExample3() {
/{ Local Scope #3
}
// Global Scope
Block Scope:
Block scope is defined with curly braces. ECMAScript 6 introduced the 1¢t and const
keywords. Variables declared with 1e: and cons: can have block scope. They can only
be accessed in the block in which they are defined.
//Global. Scope
let x = 1;
hitps:sImedium. com @pvivekdlscope-and-execution-contex-injavascrip'-3b7 1e76cd183sanar2020 ‘Scope and Execution Context in Javascriot| by Vivek | Medium
Open in app
console.log(x); //1
var declaration has no block scope.
In the above example, if we replace iet with var then the value of x will be 2.
(fun
on blockScopeExample () {
for(var i=0; i<5; i++)
setTimeout (function logValue () {
console. log (i); 15.
}, 100);
OF
Inthe above example, the setTimeout function callback isn’t triggered until the for loop
execution has completed. Since, var declaration has no block scope. When the for loop
has finished executing the value of i is 5. Now when the setTimeout call begins to
execute it uses the last set value of i which is 5. Hence S is printed in all the setTimeout
callbacks.
However, if we declare variable i with 1¢t which has block scope, it creates anew
variable locale to the block scope, for each iteration. The next loop code shows 0 1 2 3
a5.
(function blockScopeExample () {
for (let i