negating self invoking function? !function ($) { …

2019-06-07 19:53发布

问题:

Possible Duplicate:
What does the exclamation mark do before the function?

I was looking through the Twitter Bootstrap JavaScript code and I noticed all their plugins are wrapped in negating self invoking functions.

I am aware that function ($) { ... }(window.jQuery); invokes the function immediately.

But what is the ! for?

回答1:

1) if you just do:

function () { /* ... */ }();

You will get an error.
JS will not allow you to fire off a function declaration (because of a concept of "variable hoisting", which isn't technically correct, but is much easier for a lot of people to think about).
If you use declarative functions:

function myFunc () { /* ... */ }

The JS engine will create them in the scope you're in, before creating the variables of the scope -- even if the vars are all on the top and the functions are all on the bottom.

So when you write:

function myFunc () { /* ... */ }();

There's an error there, because the vars which don't even exist yet, in the current scope might be called inside, which is a guaranteed crash.

To further that, if you don't give your function-declaration a name:

function () { /* ... */ }

...then there's an error there, regardless, because you can't call the function yet, but you have no way of getting at it, because it doesn't have a name, and you didn't assign it to a variable.

Operators like () or + or ! -- anything which will force the engine to evaluate whatever comes next, will allow you to fire the function like:

+function () { /* ... */ }();

As long as there is no variable listening for a return statement, you're fine.

2) Additionally, in the case of !function () { /*...*/ }();, if that function doesn't have a return statement naturally, then it will return undefined.
The opposite of undefined is true when coerced in that way...

...so if you really, REALLY wanted, you could do something like:

var success = !function () { /* ... */ }();
if (success) { doStuff(); }