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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Определите, является ли представленная функция Function Declaration или Function Expression:

javascriptfunction func() {
  console.log('!');
}
Задание 2

Определите, является ли представленная функция Function Declaration или Function Expression:

javascriptlet func = function() {
  console.log('!');
}
Задание 3

Определите, является ли представленная функция Function Declaration или Function Expression:

javascript+function() {
  console.log('!');
}
Задание 4

Определите, является ли представленная функция Function Declaration или Function Expression:

javascript!function func() {
  console.log('!');
}
Задание 5

Определите, является ли представленная функция Function Declaration или Function Expression:

javascript-function func() {
  console.log('!');
}
Задание 6

Определите, является ли представленная функция Function Declaration или Function Expression:

javascript1 + function func() {
  console.log('!');
}
Задание 7

Определите, является ли представленная функция Function Declaration или Function Expression:

javascript(function func() {
  console.log('!');
})
Задание 8

Определите, является ли представленная функция Function Declaration или Function Expression:

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