Nuance funkčních výrazů v JavaScriptu

Název Function Expression není dán jen tak. Skutečně znamená to, že takové funkce jsou součástí nějakého výrazu.

Například můžeme sečíst nějaký řetězec a bezejmennou funkci:

javascriptlet str = 'str' + function() {return 3;};
console.log(str); // vypíše 'strfunction() {return 3;}'

Proč vidíme takový podivný výsledek, a ne číslo 3? Protože druhý sčítanec - to není výsledek práce funkce, ale její zdrojový kód (vždyť jsme tuto funkci nevolali, ale jednoduše napsali).

To znamená, že název funkční výraz označuje to, že taková funkce se účastní nějakého výrazu.

Přiřazení k proměnné je také výraz:

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

Lze také, například, předat funkci jako parametr do console.log a ten vypíše její zdrojový kód do konzole - to se také bude považovat za výraz:

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

Proč je to důležité: protože rozdíl Function Declaration a Function Expression není vůbec v tom, že první funkce je vytvořena s jménem, a druhá zpočátku jméno nemá. To není pravda.

Příklad. Zde máme funkci bez jména, ale přitom se neúčastní žádného výrazu (to znamená, že s ní neprovádíme žádné akce, řečeno jednoduše):

javascript/*
  Tato funkce bude Function Declaration,
  ale se syntaktickou chybou:
*/
function() {
  console.log('!');
}

Takový kód obecně vydá chybu! Proč: protože funkce se neúčastní žádného výrazu, takže prohlížeč ji považuje za Function Declaration, ale nenajde její jméno a vydá chybu.

Aby chyba zmizela, je třeba donutit funkci stát se součástí nějakého výrazu. Například, napíšeme před ní operaci +:

javascript+function() { // takový kód je korektní
  console.log('!');
};

Jak to funguje: samotná operace + nic nedělá, je to stejné jako napsat místo čísla 3 číslo +3 - přípustné, ale nic nemění.

Ale v případě funkce - mění. Nyní naše funkce už není jen napsána, ale účastní se výrazu. Proto chyba nyní nebude. Výsledku provedení funkce také nebude, vždyť jsme ji jednoduše napsali, ale nevolali.

Místo + lze napsat cokoliv. Například:

javascript-function() { // takový kód je korektní
  console.log('!');
};

!function() { // takový kód je korektní
  console.log('!');
};

Lze také vzít naši funkci do kulatých závorek, v tomto případě se také stane funkčním výrazem:

javascript(function() { // takový kód je korektní
  console.log('!');
});

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

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

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

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

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

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

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

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