How does a variable without var keyword in self invoking function works?

Question

var salary = "1000$";

(function () {
    console.log("Original salary was " + salary); //1000$

    salary = "5000$";

    console.log("My New Salary " + salary); //5000$
})();

(function () {
    console.log("Original salary was " + salary); //undefined ?? 

    var salary = "5000$";

    console.log("My New Salary " + salary); //5000$
})();

Why and how first and third console logs are displaying different outputs ?

Answer 1

This is due to variable hosting .In your second IIFE function , you have already declared salary variable , it actually moves to the top of the function and overshadows your global salary function

javascript convrts this code like .see the code.

  var salary = "1000$";

    (function () {
        console.log("Original salary was " + salary); //1000$

        salary = "5000$";

        console.log("My New Salary " + salary); //5000$
    })();

    (function () {
        var salary ;
        console.log("Original salary was " + salary); //undefined ?? 

        // get move to opvar salary = "5000$";

       salary = "5000$";

        console.log("My New Salary " + salary); //5000$
    })();

Answer 2

The top line creates a global variable called salary. Within the scope of the second function, there is a local variable called salary. This means in the second function you cannot access the global variable in that way, and the local variable hasn't been set yet so it is actually undefined until the line where it is set.