How does this Angular JS code snippet work?

Question

Why does following snippet work in Angular JS?

var app = angular.module('store',[]); 



(function(){
    app.controller('StoreController',function(){
        this.blabla = student;
    });
})();

var student = 
{
    name:"Abc Def",
    rollNumber:12,
    isBrilliant: true,
    isMale:false,
    isFemale: false,
    istest:true
};

Even though student comes after the function where it's being used and student is not hoisted still why does the above function work?

But in contrast to the above example, this one:

(function(){
        console.log("Name is :"+student);
    })();

    var student = {
        name:"xyz"
    };

Shows student as undefined means it wasn't hoisted.

Answer 1

.controller registers a controller function but doesn't execute it right away - it enqueues it for a later phase. Then, student variable is assigned an object.

That controller function, however, is a closure over student variable - in other words, it has access to it at run-time. Read more about closures. And so, when it does finally execute, student variable is defined.

In contrast, the second example's console.log, whether it is enclosed in immediately-invoked function expression or not, executes before student variable is assigned, and so it is undefined.