This question already has answers here:
What is the (function() { } )() construct in JavaScript?
(28 answers)
Why define an anonymous function and pass it jQuery as the argument?
(5 answers)
Immediately-Invoked Function Expression (IIFE) In JavaScript - Passing jQuery
(1 answer)
Closed 9 years ago.
Could someone explain in layman's terms what the following construct is doing:
(function(jQuery) {
// some javascript code here
})(jQuery);
of course, any "read this post", or "read this link", or even "don't do that! this is a better way" kind of responses are also more than welcome.
This code is creating an anonymous, self-invoking function with a reference to a variable called jQuery from the parent scope passed as first argument.
This syntax is often use to "namespace" the code you are writing to avoid the pollution of the global scope, very popular with JavaScript Module pattern.
Related
This question already has answers here:
What's the difference between a global variable and a 'window.variable' in JavaScript?
(5 answers)
What is the purpose of the var keyword and when should I use it (or omit it)?
(19 answers)
Location of parenthesis for auto-executing anonymous JavaScript functions?
(4 answers)
Closed 5 years ago.
I am working on a project in javascript and while going through design pattern concepts came across following point.
I have a sample code as below:
window.customfun = (function(){}())
Here i have two questions:
1) Can we not simply define a global function as below:
customfun = (function(){}())
2) (function(){}()) is an anonymous function with its own evaluation environment but i have learnt that to be implemented as : (funtion(){})()see the position of parentheses around couple of parentheses. I found that both are working so i wanted to know if there is any difference between them?
Sure, you can define global functions
No, there is actually no difference.
Is there a difference: (1+(1)) === (1) + (1) ?
This question already has answers here:
What is the (function() { } )() construct in JavaScript?
(28 answers)
Closed 7 years ago.
I am learning about JavaScript functions on MDN
I came across an example that looks similar to this:
var saySomething = ( function(){console.log("hello")} )();
I have also seen this in the jQuery source.
I have not found any explanation of this style of function calling/definition on the MDN function reference.
I know from running the code that it calls itself immediately upon interpretation by the JavaScript engine.
Is this the Grouping Operator in action? Where it says:
First evaluate the body of this function and return it
Since the parentheses () immediately follow it it gets called ?
Google "Immediately Invoked Function Expression" or "IIFE".
The general syntax looks like this:
(function(){
// do something here
})():
Sometimes you'll see arguments passed in as well. It's basically used to wrap your code so none of your variables leak out into the global namespace.
This question already has answers here:
What is the (function() { } )() construct in JavaScript?
(28 answers)
What does (function($) {})(jQuery); mean?
(6 answers)
Closed 8 years ago.
What does (function($) {})(); mean?
Its an Immediately-Invoked Function Expression (IIFE).
It means that the code between the curly braces will be executed as soon as its parsed and inside a closure. This means that any variables declared inside the function body with var will be discarded from memory after the function is finished executing. This is a way to isolate code and prevent namespace polution. You can also use this to rename variables for a particular scope:
For example, consider jquery:
(function($){
//inside the closure, jquery can be accessed using '$'
$(...)
})(jquery);
or
(function(customJqueryName){
//inside the closure, jquery can be accessed using 'customJqueryName'
customJqueryName(...)
})(jquery);
Check out closures: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Closures
IIFE: http://benalman.com/news/2010/11/immediately-invoked-function-expression/
It's an anonymous inline-function, which will be called just after definition.
This question already has answers here:
What is the purpose of a self executing function in javascript?
(21 answers)
What is the (function() { } )() construct in JavaScript?
(28 answers)
Closed 8 years ago.
I see this in some HTML files that use jQuery, at the bottom:
(function() {
setTimeout(function(){window.scrollTo(0,0);},0);
})();
What does it mean to put the whole function in round brackets?
The code you gave as example is a self-executing anonymous function.
You can read more about them here.
Relevant text from that article:
What’s useful here is that JavaScript has function level scoping. All variables and functions defined within the anonymous function aren’t available to the code outside of it, effectively using closure to seal itself from the outside world.
(function() {})(); means it is self executing anonymous function. It get called immediately when java script get rendered. More details you can search it.
setTimeout is a function which accepts two parameters:
First parameter: A function
Second parameter: an integer value in milliseconds.
By calling the setTimeout function, the function from first parameter will be called/invoked after the amount of time specified in the second parameter.
This question already has answers here:
How does the (function() {})() construct work and why do people use it?
(15 answers)
Closed 9 years ago.
I have downloaded an external JavaScript file and want to create a HTML5 User Interface for it. I don't understand why the JavaScript code (see bellow) initiates his main function like that.
//JavaScript Code
(function(Raphael) {
// some codes here
})(window.Raphael);
Why is that function between parentheses?
What does the "window.Raphael" mean?
This is an example of a self invoking anonymous function.
You are passing in window.Raphael into this function which is essentially "renamed" to Raphael inside the function.
That is an immediately executing function (IIFE). Meaning one thats defined and executed immediately afterwards.
In this case, its also using RaphaelJS which is an SVG library. The IIFE accepts a global variable presumably defined by Raphael that is accessible at window.Raphael