0

I am currently playing with playframework. I started out with the tutorial which uses Coffeescript. The CoffeeScript is converted to javascript, and this particular example, the javascript method needs to dynamically generate a list when the page is loaded.

The javascript generated uses a pattern that I've seen before, which I've read can be used for scoping variables or functions. That is, it envelopes everything inside an anonymous function.

However, within that anonymous function is the callback for window.isReady, in JQuery style.

(function() {
  $(function() {
      // the code within the callback goes here!
  });

}).call(this);

Is this just due to the result of this having been generated by a set of programmed rules, or could there be a reason to have the callback inside the anonymous function? A reason to scope that JQuery onReady callback?

Of course, the functionality works without being enclosed by the self-called anonymous function. So, is there any benefit?

Mark Schultheiss
  • 32,614
  • 12
  • 69
  • 100
svaens
  • 649
  • 7
  • 23
  • 1
    The build process puts CoffeeScript files inside the function as a means of isolation. There's nothing "mindless" about it, that's how they decided to do it. – Dave Newton Dec 29 '15 at 16:57
  • The common term to refer to "self-called anonymous function" is "Immediately Invoked Function Expression" (IIFE) – haim770 Dec 29 '15 at 16:57
  • I wouldn't go as far as to throw around the word 'mindlessly' if you're asking a question.. The latter indicates your lack of knowledge, while the former (word) indicates a presumption. To answer your question, it's good coding style which allows for further modifications. – Andrue Anderson Dec 29 '15 at 16:58
  • The IIFE creates a scope of it's own, and it's quite common to enclose code in IIFE's to avoid interference from other scripts. Of course the jQuery DOM ready handler also creates a scope of it's own in this case, but when Coffeescript is converted to javascript the interpreter probably doesn't know about all the inner workings of jQuery and other libraries, it just puts everything inside an IIFE to be sure – adeneo Dec 29 '15 at 17:00
  • 1
    I didn't mean 'mindlessly' to mean 'without good reason', but just with the idea in mind that this is being automatically generated (yes, perhaps for good reason) and not hand-written by a human. But yes, I have a certain lack of knowledge, already obvious by the fact that I was asking the question. But in any case, I didn't intend on offending. – svaens Dec 29 '15 at 17:04
  • @adeneo Yes, that is what I had assumed. But wanted to ask in case there were other benefits besides isolation, as Dave mentions above. – svaens Dec 29 '15 at 17:06

2 Answers2

1

Since the function delimits a scope, you want to do this as a best practice to prevent polluting the global namespace.

In this simple example it might not be necessary since you don't save any variable, but you could have privates or other functions (and not have them global)

Like this:

(function() {

  var a = 5;

  var f = function() { ... }


  $(function() {
      // the code within the callback goes here!
      f();
      console.log(a);
  });

}).call(this);
Carlo
  • 2,103
  • 21
  • 29
1

It's called an IIFE (Immediately Invoked Function Expression). Well...a flavor of it at least. You don't normally use .call for an IIFE, but it does the same thing. It's purpose in this case is mainly to prevent pollution of the global scope.

Learn about them here.

Community
  • 1
  • 1
Jimbo Jonny
  • 3,549
  • 1
  • 19
  • 23
  • Thanks for your answer. Yes, that is what I suspected. Keeping variables and functions out of the global scope. Though in this case, there were no variables defined. Only the callback. Is this something that would also 'pollute' the global scope? Regarding the 'call' - This is just now it was generated. I am new to javascript and tried to change this to something I have seen elsewhere, just to append () to the end instead of the 'call', but somehow play didn't like it. It was being stripped out with the message "[info] JavaScript linting on 1 source(s). That's JSLint ? – svaens Dec 29 '15 at 17:25