Is There a Difference Between (Function() {...}()); and (Function() {...})();

What is the difference between function and Function

Go through this tutorial

Defining functions
The Function constructor

https://developer.mozilla.org/en/JavaScript/Reference/Functions_and_function_scope

what is the difference between .function() and a function(args) in javascript

This is a function. It is called as function()

function test(a, b) {  return a * b;}
console.log(test(2,3));

difference between function($) and $(function())

They may look similar, but they are completely unrelated.

This is called an Immediately Invoked Function Expression (IIFE). These are not specific to jQuery, but in this case, it ensures that within the body of this function, $ will refer to jQuery, even if something outside the function has overwritten the global $ variable with something else. It is a defensive practice for minimizing conflicts with other libraries.

An additional benefit is that any variables declared within this function will not be added to the global scope. Even without jQuery, this is a common practice used to help modularize code and avoid polluting the global scope.

(function($) {
    "use strict"; 

})(jQuery); 

This tells jQuery to execute the specified function when the DOM is "ready":

$(function() {
    run_code();
});

Difference between (function(){})(); and function(){}();

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,

What's the difference between a method and a function?

A function is a piece of code that is called by name. It can be passed data to operate on (i.e. the parameters) and can optionally return data (the return value). All data that is passed to a function is explicitly passed.

A method is a piece of code that is called by a name that is associated with an object. In most respects it is identical to a function except for two key differences:

1. A method is implicitly passed the object on which it was called.
2. A method is able to operate on data that is contained within the class (remembering that an object is an instance of a class - the class is the definition, the object is an instance of that data).

(this is a simplified explanation, ignoring issues of scope etc.)

Difference between this.function and this.function()

this.functionName reads the value of property functionName of the object this.

this.functionName() reads the value of property functionName of the object this and tries to call it as a function. It will throw an error if the value of this.functionName is not a function.

Decompose the statement as

this.functionName()
\____callee_____/
\_CallExpression__/

"callee" can be any expression but must resolve to a function object.

Check out the AST if you are curious.

What is the difference between function() and ()= function() in flutter?

So let's have a look at how these actually work!

Dart has a formal specification documented and you can have a look at it by clicking here. A function in Dart has to have a few qualities which are:

1. return type (optional but recommended)
2. name (required)
3. parenthesis right after the name (required)
4. a list of parameters (optional)
5. function body inside curly brackets or a single statement of function body in front of =>.

Your question is about point #5. The difference between {} and => function body is that the curly brackets allow you to write multiple statements separated with a semi-colon ; while the second approach shall just be one statement, ended with a single semi-colon ;.

Let's have a look at a few examples. Here is a simple log() function that allows you to log any Object instance to the debug console:

import 'dart:developer' as devtools show log;

extension Log on Object {
  void log() => devtools.log(toString());
}

Note how the function has a return type of void (point 1), a name called log (point 2), no parameters denoted by () (point 3 & 4) and a function body which is a single statement with => (point 5).

You could write the same function with curly brackets (point 5) instead of => like so:

extension Log on Object {
  void log() {
    devtools.log(toString());
  }
}

The result of which will be exactly the same as the previous implementation.

Now let's look at another example where your function has a return value and some parameters.

String fullName(String firstName, String lastName) {
  return "$firstName $lastName";
}

Since this function has simply one statement, the return statement and just one semi-colon, it could be re-written as an arrow function like so;

String fullName(
  String firstName,
  String lastName,
) =>
    "$firstName $lastName";

So I would say the unwritten rules are:

1. Use arrow-functions if the body of your function is simple to understand. You could even have multiple lines of code inside an arrow-function's body as long as it's understandable, it's OK to use.

2. Use function bodies with curly-brackets if your function's body is rather complicated, consisting of multiple perhaps un-related pieces of code.

Is there a difference between (function() {...}()); and (function() {...})();?

There is no practical difference in those two forms, but from a grammatical point of view the difference between the two is that The Grouping Operator - the parentheses - will hold in the first example a CallExpression, that includes the FunctionExpression:

               CallExpression
                |         |
       FunctionExpression |
                |         |
                V         V
    (function() {       }());
    ^                      ^
    |--PrimaryExpression --|

In the second example, we have first a whole CallExpression, that holds the FunctionExpression:

          PrimaryExpression
                |
         FunctionExpression
                |
                V
    (function() {       })();
    ^                      ^
    |--  CallExpression  --|

What is the difference between function() and () = in javascript

Option B uses later syntax for javascript ES6 (also known as ES2015). It is only gradually being supported in browsers and node; usually if you want to use it currently you'll transpile it using something like Babel (this will effectively turn option B's code into option A's).

https://babeljs.io/docs/learn-es2015/

https://strongloop.com/strongblog/an-introduction-to-javascript-es6-arrow-functions/

---

Related Topics