You are on page 1of 10
sanar2020 Hoisting damystied wth popular interview questions | by Vivek | Medium Open in app Vivek 19Followers » About Follow Hoisting demystified with popular interview questions e Vivek May 25,2019 - 4 min read In this post, we will learn about one of the most frequently asked questions in an interview, hoisting in javascript. We should have a better understanding of Scopes and Execution Context in javascript to understand the concept of hoisting. You can refer to my previous article Scope and Execution Context in Javascript for better understanding of these concepts. Let’s cover some important points before discussing some popular interview questions related to hoisting: * JavaScript only hoists declarations, not the initialization. * sequence in which variable declaration and initalisation occurs: Declaration -> Initialization/Assignment -> Usage // Variable lifecycle // Dec ion // Assignment console.log(a); // Usage ¢ Allundeclared variables are global variables. ¢ Justlike var, 1et and const declarations are hoisted to the top. Unlike var which is initialized as undetined, the 1et and const keyword is not initialized. So if you hitps:imedium com! veka hoisting demystfied-with-popular-inerview-questons-38a93ea441ff ano sanar2020 Hoisting damystied wth popular interview questions | by Vivek | Medium try to usea ict variable before declaration, you'll geta Reference Error. * function declarations hoist the function definitions.Hence, functions declaration can be used before they are declared. functionDeclaration() // output: "Hoisted" function functionDe console. log ( Javascript interpreter interprets the above code as: // Hoisted code function functionDeclar: console. log ('Hoisted") { of the code Declaration() // outpu "Hoistea" ¢ Function expressions in JavaScript are not hoisted. functio function “xpression() // TypeError: funi ionExpression is const functionExpression = function() { console.log('Not Hoisted") Hence, you cannot use function expressions before defining them. Now on to some interview questions! Hoisting Interview Questions a console. log(y); y=. hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf 2n0 sanar2020 Hoisting damystied wth popular interview questions | by Vivek | Medium console. log var y = 2; = 3; console. log (y); var yi Output: © ReferenceError: y is not defined undefined 3 Explanation: Behind the scene, JavaScript interprets above code as: console.log(y); // ReferenceError: y is not defined yol var y = undefined; console.log(y); //undefined ya2s var y ~ undefined; y=3; console.log(y); // 3 Q2 var a=1; console. log (a); var a = 2; console. log (a); Output: © 1 2 hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf ano sanar2020 Hoisting damystied wth popular interview questions | by Vivek | Medium Explanation: Behind the scene, JavaScript interprets above code as: var a = undefined; a=1; console.log(a); //1 a= 23 console.log(a); // 2 Q3 var z= 1; let 2; console. log(z); console. log (2); let z= 1; Output: ©) Identifier ‘7’ has already been declared Cannot access ‘2’ before initialization Explanation: Behind the scene, JavaScript interprets above code as: var z= 1; let z; //Identifier ‘z’ has already been declared console. log (z); let 2; console.log(z); // Cannot access ‘z’ before initialization z=; Q4 function hoistExampl var a; console. log ("Before a = 10; rae hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf 4no sanar2020 Hoisting damystied wth popular interview questions | by Vivek | Medium console.log("After: ", a); ) hoistExample (); Output: ® Undefined 10 Explanation: Behind the scene, JavaScript interprets above code as: function hoistingExample() { var a = undefined; console.log("Before: ", a); // undefined a = 10; console.log("After: ", a); // 10 ) hoistin ample () 7 Qs function hoisting=xample() { console.log("Value of a in local scope vali } console.log("Value of a in global scope: ", vara 1; hoistingExample(); Output: © Value of a in global scope: Undefined Value of a in local scope: 1 Explanation: Behind the scene, JavaScript interprets above code as: var a = undefined; function hoisting=xample() console.log("Value of a in local scope: ", a); // Value of a in local scope: 1 } console.log("Value of a in global scope: ", global scope: Undefined a=l; hoistingExample (); ; // Value of a in hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf 510 sanar2020 Hoisting damystied wth popular interview questions | by Vivek | Medium 26 function hoisting=xample () a1; } hoistingExample () ; console. log (a); function hoisting=xample() var a= 1} } hoistingExample (); console. log (a); Output: © 1 ReferenceError: a is not defined Explanation: Behind the scene, JavaScript interprets above code as: var a = undefined; function hoistingExample () a-l; } hoistingExample () ; console.log(a); // 1, Variables which are assigned without a var declaration are considered to be global variables function h var a = undefined; a=l; } hoistingExample(); console.log(a); // ReferenceError: a is not defined, var a is defined inside local scope. ingExample () Q7 hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf ana sanar2020 Hoisting damystied wth popular interview questions | by Vivek | Medium function a() { console. log ("1") } ad: function a(){ console. log ("2") ) ade Output: © 2 2 Explanation: Behind the scene, JavaScript interprets above code as: function a(){ console. log("1") } function a(){ console. log ("2") ) ade ff 2 adi // 2 Qs var test function functionHoisting() { test = 10; return function test () {} } functionHoisting(); console. log (test); hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf 70 sanar2020 Output: ©) 1 Hoisting damystied wth popular interview questions | by Vivek | Medium Explanation: Behind the scene, JavaScript interprets above code as: var test function functionHoisting() //function Hoisting, test is re-defined and re-declared function test() (} test = 10; retur. functionHoisting(); console.log(test); // 1 Qo alert (a()); function a() { var b = function() { return return b(); var b = function() { return 8; alert (a()); function a() ( function b() { return 3; return b(); function b() { return 8; Outpu 3 © hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf ano led with popular interview questions | by Vivak | Medium sanar2020 Hoisting damys 8 Explanation: Behind the scene, JavaScript interprets above code as: function a() { var b = function() ( alert(a()); // 3 function a() ( function b() { return 3; //Function Hoisting function b() { return 8; return bQ); ) alert(a()); // 8 This concludes JavaScript Hoisting from my side. Thanks for reading. Please & if you liked this article. Explore the Series: * ES6 -Difference between Var, Let and Const with Examples © Scope and Execution Context in Javascript + Javascript Closures If you have any doubt, feel free to comment below! I'd be happy to help@) JavaScript _JavascriptHoisting Hoisting _ Javascript Interview hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf sn0 sanar2020 Hoisting damystied wth popular interview questions | by Vivek | Medium CP Google Play hitps:sImedium.com/@pvivekd/hoising-demystfied-ith-popular-interview-questions-38a03ea4 ttf ron0

You might also like