Self Invoking functions difference [duplicate] - javascript

This question already has an answer here:
What is this javascript syntax? !function(){} [duplicate]
(1 answer)
Closed 7 years ago.
What is the difference between these two self invoking functions? The function does not work if the ! (not) symbol is added.
Please clarify if any one has clear understanding.
// first
(function( $ ) {
// ...
})( jQuery );
// second
!function($){
alert("test1");
}(jQuery), function(){
alert("test2");
}(jQuery);

!function () {} means negative function (similar to if (!someVar) {}), to make sure what result is before making it negative, function must be executed. So ! can be replaced with +.
You have something wrong with //second, because you create two anonymous functions and between there is ,. I think you are getting syntax error in this place, so next function does not work (and is not executed, because no one is calling this function)

Related

Meaning of !function in Javascript self invoking function [duplicate]

This question already has answers here:
What does the exclamation mark do before the function?
(8 answers)
Closed 5 years ago.
Sorry for posting this but !function is not google-able and I did not find it in my JavaScript code.
Here is how Twitter uses it:
Tweet
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
from https://twitter.com/about/resources/buttons#
It is short-hand or alternative of self-invoking anonymous function:
(function(){
// code
})();
Can be written:
!function(){
// code
}();
You can also use + instead of !.
If you simply did:
function(){
// code
}();
That will create problems, that's why you need to add ! before it which turns the function declaration into function expression.
Quoting docs, section 12.4:
An ExpressionStatement cannot start with the function keyword because
that might make it ambiguous with a FunctionDeclaration.
To better understand the concept, you should check out:
Function Declarations vs. Function Expressions
they're negating the result, not the function itself:
!function( x ){ return x }( true );
!true
false
In reality, it's a slightly compressed form of:
(function(){}())
since it requires 1 less character. The reason it's needed is that you can't call a function declaration directly, e.g. this is invalid:
function(){}()
but adding the ! at the beginning turns it into a function expression and makes it work.
It's usually used to work around a quirk in the JavaScript syntax. This gives a syntax error:
function() {
}();
It's read as a function declaration (like function foo () {}), rather than a function expression. So adding the ! before it, or wrapping it in parentheses, forces the parser to understand that it's an expression.

anonymous javascript function call !function vs function [duplicate]

This question already has answers here:
Javascript anonymous function call [duplicate]
(4 answers)
Closed 9 years ago.
How come
function(){ alert("test123");}()
produces SyntaxError: Unexpected token (
while
!function(){ alert("test123");}()
alerts "test123"
?
It's because by adding ! sign you convert the declaration into an expression and invoke it immediately.
By enclosing your function into brackets you will make first example working without errors:
(function(){ alert("test123");})()
To make it clearer you can think about first expression as something like:
if (false || !function(){ return false; }())
And as #zerkms noticed there is a complete explanation of Immediately-invoking functions.

(function(symbolName) { - What does this mean [duplicate]

This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
What do parentheses surrounding a JavaScript object/function/class declaration mean?
What does (function($) {})(jQuery); mean?
I am trying to understand how Edge works so I can use my own code,
I have not come accross this before, but what does this mean:
(function(symbolName) {
//CODE
})("stage");
It's an anonymous function that is defined and then called with the argument "stage"
It is the similar to doing:
var myfunc = (function (symbolName) {
//CODE
});
myfunc("stage");
OR
function myfunc(symbolName) {
//CODE
}
myfunc("stage");
except that when the function is defined in either of these ways it will be 'hoisted' to the top of the block scope - but thats a whole other topic.
In Javascript you can ddefine anonymous functions by simply typing:
(function(){alert("Hello")}); /* ok, this do nothing, but it is correct */
It is also possible to call a function directly:
(function(){alert("Hello")})(); /* alert is displayed */
If the function has arguments, you have to specify the arguments:
(function(args){alert(args)})("Hello"); /* alert is displayed with the passed arguments */
I suggest you this tutorial.

What this mean in javascript? [duplicate]

This question already has answers here:
Closed 12 years ago.
Possible Duplicate:
Explain JavaScript's encapsulated anonymous function syntax
I have just read a javascript book but I have seen this code:
1(function() {
// code
})();
what is this ? is a special function ?
As written, it has a syntax error.
I'm guessing it was more like:
(function() {
// code
})();
or
(function() {
// code
}
)();
Break it down:
(FOO)() // calls FOO with no arguments.
And
function() { //creates a function that takes no arguments.
// code
}
Hence together it would create a function that takes no arguments, and then call it. I can't see why you would apart from just showing that you can.
It looks like the intent was to declare the function inline/anonymous and immediately execute it.

Difference between (function(){})(); and function(){}(); [duplicate]

This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Are “(function ( ) { } ) ( )” and “(function ( ) { } ( ) )” functionally equal in JavaScript?
This is something I haven't quite figured out yet, but I have been using function(){}() just because my VIM syntax highlight screws up if I add the parenthesis, although I've seen (function(){})() around many times, maybe its an IE thing?
edit:
var singleton = function() {
// code
}();
var singleton = (function() {
// code
})();
Peter Michaux discusses the difference in An Important Pair of Parens.
Basically the parentheses are a convention to denote that an immediately invoked function expression is following, not a plain function. Especially if the function body is lengthy, this reduces surprises,
The extra set of parentheses makes it clearer that you are constructing a function and then calling it. It's a coding style thing, not a functionality thing.
function(){}();
doesn't work in most of browsers. You should use parenthesis around the function in order to execute it
(function(){})();
then browser will know that last parenthesis should be applied to all the expression
function(){}
UPD: If you don't use parenthesis, the brower could misunderstand you. If you just call the function and dismiss the result
function() {
alert(1);
}();
then ff and ie will throw error

Categories