Question

Check out this piece of JavaScript code:

(function (w, d) {
    var loader = function () {
        var s = d.createElement("script"), tag = d.getElementsByTagName("script")[0];
        s.src = "https://example.org/script.js";
        tag.parentNode.insertBefore(s,tag);
    };
    w.addEventListener ? w.addEventListener("load", loader, false) :
                         w.attachEvent("onload", loader);
}) (window, document);

Why did the author of this code use this method to include a script in the document?
And what is the usefulness of the line:

w.addEventListener ? w.addEventListener("load", loader, false) :
                     w.attachEvent("onload", loader);

Last point: I’m a JavaScript beginner, what is the (window, document) at the end?

Answer 1

The following addEventListener line is to register the function so that it gets called when the page finishes loading. Internet Explorer and Firefox (et al) use different functions to do this.

w.addEventListener ? w.addEventListener("load", loader, false) :
                 w.attachEvent("onload", loader);

In javascript a function is an object in and of itself. As such it’s ‘value’ can be assigned to a variable or consumed immediately. To consume it immediately it must be wrapped in parentheses (otherwise it won’t do what you want) and then call it like it were a regular function.

(function (w, d) { ... }) (window, document);

It’s more obvious what is going on if we break it up across two lines.

var a = function(w, d){ ... };
a(window, document);

It was done this way to as to not pollute the global scope with temporary values or functions. Not to mention not trashing anyone else variables. This can be broken into two parts:

1. By encapsulating the code in a closure anything explicitly declared inside is in the closure’s scope, not the global scope. var loader is in the closure’s scope.
2. By consuming the closure immediately it won’t be stored in a variable in the global scope. Since it was declared anonymously it won’t exist as a named function in the global scope.