2Minutes: Variable Hoisting in JavaScript (var keyword)

What Is Variable Hoisting ?

Have a look at the following code:

console.log(name); // Output: undefined

var name = "Mouhammad";

console.log(name); // Output: Mouhammad

console.log(name); // Output: undefined

var name = "Mouhammad";

console.log(name); // Output: Mouhammad

If we weren’t using the var keyword here, we’d get a ReferenceError. However, because variables declared with var are hoisted, the first console.log prints undefined instead.

Here’s roughly what JavaScript does during the memory creation phase (before it starts executing your code):

var name;

console.log(name);

name = "Mouhammad";

var name;

console.log(name);

name = "Mouhammad";

So you mean that other variable creating keywords such let and const have different hoisting behavior? Yes! In the next post, we will know exactly how.

That’s 2Minutes Concept, see you in the next one !

Sources

https://developer.mozilla.org/en-US/docs/Glossary/Hoisting

https://www.w3schools.com/js/js_hoisting.asp

https://www.sitepoint.com/demystifying-javascript-variable-scope-hoisting