What is hoisting javascript ?

Short answer: Hoisting is javascript behaviour that move declaration to the top

yourName="Jiwoo";
console.log(yourName);
var yourName;

What really happen here is during compile phase, javascript will put the variables declaration into memory, visually similar like this:

var yourName;
yourName="Jiwoo";
console.log(yourName);

Okay then let's try another example

number1 = 3;
console.log('number 1', number1);
console.log('number 2', number2);
console.log('number 3', number3);
var number2 = 3;


// output
// number 1 3
// number 2 undefined
// Uncaught ReferenceError: number3 is not defined

What the heck is going on here?, okay let's break it down

Since there is no declaration and initialisation for variable3 it's make sense when the result Uncaught ReferenceError: number3 is not defined

We didn't make any variable declaration for number1, but why it's give correct answer?, it's because javascript "magically" create a declaration for number1 variable and move it to the top. In simple term javascript saying "Hey you're initialize number1 with value 3 but you're not making any declaration, okay lazybones I will do it for you huufh 😩"

number2 are the most confusing, you already initialize and declare your variable but why it's give you undefined?, Remember that hoisting only move declaration?, it's mean that javascript only move number2 declaration to the top and because initialization happen after console.log it will give you undefined as result