Нюансы функциональных выражений в JavaScript

Название Function Expression дано не просто так. Оно действительно означает это - то, что такие функции являются частью какого-либо выражения.

Например, мы можем сложить какую-нибудь строку и безымянную функцию:

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

Почему мы видим такой странный результат, а не число 3? Потому что второе слагаемое - это не результат работы функции, а ее исходный код (ведь мы эту функцию не вызвали, а просто написали).

To есть название функциональное выражение обозначает то, что такая функция принимает участие в каком-нибудь выражении.

Присваивание к переменной тоже выражение:

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

Можно также, к примеру, передать функцию в качестве параметра в console.log и он выведет ее исходный код в консоль - это тоже будет считаться выражением:

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

Почему это важно: потому что отличие Function Declaration и Function Expression совсем не в том, что первая функция создается с именем, а вторая изначально имени не имеет. Это не так.

Пример. Вот у нас функция без имени, но при этом не участвует ни в каком выражении (то есть с ней не совершается никаких действий, говоря по-простому):

/*
	Данная функция будет Function Declaration,
	но с синтаксической ошибкой:
*/
function() {
	console.log('!');
}

Такой код вообще выдаст ошибку! Почему: так как функция не участвует ни в каком выражении, то браузер считает ее Function Declaration, но не находит ее имени и выдает ошибку.

Чтобы ошибка исчезла, нужно заставить функцию стать частью какого-либо выражения. Например, напишем перед ней операцию +:

+function() { // такой код корректен
	console.log('!');
};

Как это работает: сама по себе операция + ничего не делает, это все равно как написать вместо числа 3 число +3 - допустимо, но ничего не меняет.

Но в случае с функцией - меняет. Теперь наша функция уже не просто написана, а участвует в выражении. Поэтому ошибки теперь не будет. Результата выполнения функции тоже не будет, ведь мы ее просто написали, но не вызвали.

Вместо + можно написать все, что угодно. Например:

-function() { // такой код корректен
	console.log('!');
};

!function() { // такой код корректен
	console.log('!');
};

Можно также взять нашу функцию в круглые скобки, в этом случае она также станет функциональным выражением:

(function() { // такой код корректен
	console.log('!');
});