Sfumature delle espressioni funzionali in JavaScript

Il nome Function Expression non è dato per caso. Significa veramente questo - che tali funzioni sono parte di qualche espressione.

Ad esempio, possiamo concatenare una stringa e una funzione anonima:

let str = 'str' + function() {return 3;};
console.log(str); // visualizzerà 'strfunction() {return 3;}'

Perché vediamo un risultato così strano, e non il numero 3? Perché il secondo addendo - non è il risultato dell'esecuzione della funzione, ma il suo codice sorgente (dopotutto non abbiamo chiamato questa funzione, l'abbiamo solo scritta).

Quindi il nome espressione funzionale indica che tale funzione prende parte in qualche espressione.

Anche l'assegnazione a una variabile è un'espressione:

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

Si può anche, ad esempio, passare una funzione come parametro a console.log e essa visualizzerà il suo codice sorgente nella console - anche questo sarà considerato un'espressione:

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

Perché è importante: perché la differenza tra Function Declaration e Function Expression non sta affatto nel fatto che la prima funzione viene creata con un nome, mentre la seconda inizialmente non ha un nome. Non è così.

Esempio. Ecco una funzione senza nome, ma che non partecipa a nessuna espressione (cioè non vengono compiute azioni con essa, per dirla in modo semplice):

/*
	Questa funzione sarà una Function Declaration,
	ma con un errore di sintassi:
*/
function() {
	console.log('!');
}

Un codice del genere restituirà un errore! Perché: poiché la funzione non partecipa a nessuna espressione, il browser la considera una Function Declaration, ma non trova il suo nome e restituisce un errore.

Per far scomparire l'errore, bisogna far sì che la funzione diventi parte di qualche espressione. Ad esempio, scriviamo l'operazione + prima di essa:

+function() { // tale codice è corretto
	console.log('!');
};

Come funziona: di per sé l'operazione + non fa nulla, è come scrivere invece del numero 3 il numero +3 - è ammissibile, ma non cambia nulla.

Ma nel caso della funzione - cambia. Ora la nostra funzione non è più semplicemente scritta, ma partecipa in un'espressione. Quindi non ci sarà più l'errore. Non ci sarà nemmeno il risultato dell'esecuzione della funzione, dato che l'abbiamo solo scritta, ma non chiamata.

Invece di + si può scrivere qualsiasi cosa. Ad esempio:

-function() { // tale codice è corretto
	console.log('!');
};

!function() { // tale codice è corretto
	console.log('!');
};

Si possono anche mettere parentesi tonde attorno alla nostra funzione, in questo caso diventerà anch'essa un'espressione funzionale:

(function() { // tale codice è corretto
	console.log('!');
});