Functional Expressions in JavaScript

There are many ways to do the same thing in JavaScript. There is good and bad in it. For a newbie, this is definitely bad, since he will not only have to learn more information, but there will also be more places to make potential mistakes. This can occur when defining functions.

There are many different ways to declare a function:

function A() {}; //   var B = function () {}; //   var C = (function () {}); //      var D = function foo () {}; //    var E = (function () {})(); //    var F = new Function(); //   var G = new function() {}; //  :   

In such an abundance is difficult not to get confused, is not it? As a rule, in everyday life we ​​use no more than three different types of function declarations, and this works fine. However, if you dig deeper, it may turn out that most of us do not even know how much the sacraments and pitfalls are stored in the operation of declaring a function.

According to the ECMA documentation, the syntax for defining the function is as follows:

 : function  (  ) {  } : function  () (  ) {  } 

Although these definitions look quite similar, there is a big difference between the function declaration and the functional expression. A Declaration of Function ( Function Declaration ) is created before the execution of any code, while a Function Expression will be created only at the moment when the interpreter reaches the given line of code.
')
A functional expression is a function declaration in the context of an expression.

Consider a few examples of functional expressions:

Assignment operator

 var a = function() {}; 

This is a classic example of assigning a functional expression through assignment. The assignment operator expects the expression to the right, which is why the function becomes part of the expression.
Having a little fantasy, you can think of the following examples:

 var a = function() { return 1; }() + 12; // 13 var b = function() { return 1; } + ''; // function (){return 1} var c = function() { return 1; } + '' - 1; //NaN 

Grouping operator

Declaring a function, we cannot execute it immediately, however, by wrapping the function declaration in parentheses - this becomes possible. The grouping operator is expressed in parentheses, and in this case it turns the function declaration into a functional expression.

 function foo() { return 1; } // undefined function foo() { return 1; }(); // Uncaught SyntaxError: Expected () to start arrow function, but got '}' instead of '=>' (function foo() { return 1; }()) // 1 (function foo() { return 1; })() // 1 

There is no fundamental difference between the third and fourth variants, since in the first case we execute an expression that defines and immediately executes the function, and in the second case, an expression defines the function that will be executed.

Operator comma

The comma operator calculates the value of each of its operands (from left to right) and returns the value of the last operand.

 0, function() { return 1; }(); // 1 

Operators (+, -,!, ~, Void)

 +function() { return false; }(); // 0 -function() { return false; }(); // -0 !function() { return false; }(); // true ~function() { return false; }(); // -1 void function() { return false; }(); //undefined 

Combined operators:

 !-function () { return false; }(); // true var c = 5 * (2 - function () {return 1}()) // 5 var c = 5 * 2 - -~function () {return 1}() // 8 

Difference of named functional expressions from not named:

Often, the name assigned to a functional expression is redundant in the context of the rest of the code, except for the case when you need to get access to the function from it. The scope of the name of a functional expression is limited exclusively by the function itself.

 var f = function getFactorial (n) { return n ? n * getFactorial(n - 1) : 1; }; f(5); // 120 

Important:
Remember, you write code for people, so try to avoid writing code in ninja style. The knowledge given in the article is useful in order to understand the internal structure of the language and not get lost if you suddenly come across such expressions in one of the projects or at the interview.