开发者

purpose of "(function() {" at the start of scripts (GreaseMonkey only?)

I'm pretty new to JavaScript, which I am learning on my own. I'm currently creating and tweaking GreaseMonkey scripts. I've noticed that most simple scripts (i.e. those with no need for named functions) go straight into the main code, but some instead are set up like this:

(function() {  
    //main code here  
})();

What is the significance of this type of coding? I've commented out both the top and bottom, and the script still runs exactly the same.

Is it just a coding standard, or does it actually have a function? And, as my title asks, is it something specific to GreaseMonkey, or something that I should do all th开发者_运维问答e time?


This technique effectively creates a private namespace, accessible only to this script. For example, this code:

(function() {
    var a = 5;
})();

will have no effect on the global namespace (the a variable is captured by the closure, so window.a will not be affected). It's a very nice way to keep many scripts from stepping on each other's global variables, by making them not global at all. I use this technique all the time when writing any JavaScript, not just Greasemonkey scripts, and would strongly recommend it as a best practice when writing libraries.

If you wanted to expose some functions to other JavaScript code instead of completely isolating your script, you could do something like this:

var MyNamespace = (function () {
    var that = {};

    that.square = function(x) {
        return x*x;
    };

    return that;
})();

Then you could do MyNamespace.square(5) from another script, and this would return 25.


It's a self executing anonymous function.

It's usually used to change the scope, all variables/functions declared inside this will be in the anonymous function's scope instead of the global (window) scope.


The code serves two purposes:

  1. It keeps objects/variables local to the anonymous function scope. This is important as we see that you may have several script files that all might share the same variable name. If they did, they could replace the variables value and truly muck with your application.

  2. The () at the the end of the line calls the declared function. In other words, the anonymous function you created inside the first set of parentheses can automatically be called instantly. Unless you assigned it to a variable, there would be no other way to call it. This avoids creating a variable in memory and just calls the function at runtime.


Here's the answer for those who never heard of the word closures:

Suppose we have a function

function sayHi() { alert('Hello'); }

We would call this function by doing this:

sayHi();

The above is whats called a named function, if you don't know what that means, then it's what you think of when you hear the word function

In some languages you don't have to name a function, you can leave it blank like so:

alert('Sup');
function() {alert('Hello'); }
3 + 1;
alert('Peace');

Line 2 is perfectly valid. Of course line 2 won't really do anything in your page, just like line 3 doesn't do anything. That is called an anonymous function. Now just like we can assign a variable to line 3 like:

result = 3 + 1;

We can do the same with line 2, like this:

myFunc = function() { alert('Hello'); };

And we can use myFunc as a function like the sayHi() function before. We call it just like we call sayHi()

sayHi();
myFunc();

Now since javascript is written to be versatile, where stuff like [0, 1, 2].indexOf(1) works, we can do the following:

func = function() { alert('hello'); };
func();
(function() { alert('hello'); })();

And line 1 & 2 will accomplish the same thing as line 3 since line 3 is just an expanded version of line 1 and 2. The advantage of line 3 is that if someone later on in the code uses a func variable it wouldn't cause a problem with your own code, also any variables declared in line 3's function (with a var keyword) won't be a valid variable outside of your function, which in this case is what a closure is.

Well that's it for this micro-tutorial, hope it helps.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜