Why is 'window.angular' used like so, in this function definition?

Problem

I'm trying to understand an angularjs file I need to use to integrate with Django, and it has a weird syntax I'm not familiar with (bear in mind I'm a junior dev, so this may be your bread and butter)...

It goes something like:

(function(angular, undefined){
    'use script';
    var djng_forms_module = angular.module('ng.django.forms', []);
    funtion hasCode(s){
        return .....
    }
    var foo = .....
}(window.angular));

I've seen this about the javascript concept of a window and it shows that the window part is the top (?) level object the browser creates when it loads the page.

Running console.log(window.angular) prints out a load of internal angular stuff. So I'm guessing that is the internal guts of AngularJS...?

But why this weird encapsulation as a function (something to do with JavaScript being a 'functional' language)?

The full script is here and I can't figure out why it uses window.angular in this function definition (as opposed to the normal way of doing things). It seems like this set up means it's not working for my application when I import it via script tags.

Problem courtesy of: Pureferret

Solution

window.angular is the global angularjs variable which is created once angularjs has been fully loaded from a script tag. The code fragment you have pasted ensures that it is executed after the population of this variable. One reason it might be written in that verbose way is simply its auto-generated nature. In a wider context, it may have implication to the order in which scripts are executed or to using different versions of the angularjs library.

Solution courtesy of: kpentchev

Discussion

There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.