Nuances of Function Expressions in JavaScript

The name Function Expression is given for a reason. What it really means is that such functions are part of an expression.

For example, we can add some string and an anonymous function:

let str = 'str' + function() {return 3;}; console.log(str); // выведет 'strfunction() {return 3;}'

Why do we see such a strange result and not the number 3? Because the second term is not the result of the function, but its source code (after all, we did not invoke this function, but simply wrote it).

That is, the name function expression means that such a function takes part in some expression.

Assignment to a variable is also an expression:

let func = function() { console.log('!'); };

You can also, for example, pass a function as an alert parameter and it will print its source code to the console - this will also be considered as an expression:

console.log(function() {return 3;});

Why this is important: because the difference between Function Declaration and Function Expression is not at all that the first function is created with a name, and the second one initially has no name. This is not true.

An example. Here we have a function without a name, but it does not participate in any expression (that is, no actions are performed with it, speaking in a simple way):

/* This function will be a Function Declaration, but with a syntax error: */ function() { console.log('!'); }

This code will give an error! Why: since the function does not participate in any expression, the browser considers it as a Function Declaration, but does not find its name and generates an error.

To make the error disappear, you need to force the function to become part of some expression. For example, let's write the operation + before it:

+function() { // this code is correct console.log('!'); };

How it works: by itself, the operation + does nothing, it's the same as writing instead of the number 3 the number +3 - valid, but nothing does not change.

But in the case of a function, it changes. Now our function is not just written, but participates in the expression. Therefore, there will be no error now. There will also be no result of the function execution, because we just wrote it, but did not call it.

Instead of +, you can write whatever you want. For example:

-function() { // this code is correct console.log('!'); }; !function() { // this code is correct console.log('!'); };

You can also put our function in parentheses, in this case it will also become a function expression:

(function() { // this code is correct console.log('!'); });

Determine if the presented function is a Function Declaration or a Function Expression:

function func() { console.log('!'); }

Determine if the presented function is a Function Declaration or a Function Expression:

let func = function() { console.log('!'); }

Determine if the presented function is a Function Declaration or a Function Expression:

+function() { console.log('!'); }

Determine if the presented function is a Function Declaration or a Function Expression:

!function func() { console.log('!'); }

Determine if the presented function is a Function Declaration or a Function Expression:

-function func() { console.log('!'); }

Determine if the presented function is a Function Declaration or a Function Expression:

1 + function func() { console.log('!'); }

Determine if the presented function is a Function Declaration or a Function Expression:

(function func() { console.log('!'); })

Determine if the presented function is a Function Declaration or a Function Expression:

console.log( function() { console.log('!'); } );
enru