PROGRAMMIAMO
JS - Funzioni anonime
Funzioni anonime

Abbiamo detto che ready serve per eseguire una porzione di codice al caricamento della pagina. Il codice da eseguire viene indicato con una notazione a noi poco familiare, che mostriamo nel dettaglio qui sotto:

$(document).ready(

    function() {
                var paragrafi;
                paragrafi = $('p').length;
                alert(paragrafi);
                }

);

Scritto in questo modo (totalmente equivalente ma più chiaro) si vede che il parametro posto fra le parentesi tonde è in realtà una funzione. Si tratta però di una funzione un po' strana, in quanto è una funzione senza nome ovvero una funzione anonima. Le funzioni anonime non fanno parte di jQuery ma sono un costrutto tipico di javascript. Tuttavia programmando in jQuery esse vengono usate molto frequentemente ed è questo il motivo per cui ce ne occupiamo ora.

Normalmente le funzioni che siamo abituati a usare noi hanno una struttura di questo tipo:

function ciao() {
                    alert("Ciao mondo!");
                    }

Dove ciao(), nel nostro caso, è il nome della funzione. Una funzione anonima invece si dichiara così:

function() {
                    alert("Ciao mondo!");
                    }

Ma a cosa serve una funzione senza nome? Le funzioni anonime si usano in javascript ogni volta che si vuole usare una funzione una sola volta, senza poi doverla più richiamare ulteriormente. In questo caso l'utilità di definire una funzione con nome viene meno, in quanto non si avrà mai bisogno di usarla nuovamente.

Per essere ancora più chiari, il codice

$(document).ready(

    function() {
                var paragrafi;
                paragrafi = $('p').length;
                alert(paragrafi);
                }

);

potrebbe anche essere scritto in questo modo:

$( document ).ready(fuori);

function fuori()
    {
    var paragrafi;
    paragrafi = $('p').length;
    alert(paragrafi);
    }

Si osservi come adesso il parametro di ready è il nome di una funzione, fuori (senza parentesi tonde!). La funzione fuori è una normale funzione con nome, definita esternamente.

Qual è dunque il vantaggio di "complicarsi la vita" e di usare funzioni anonime invece delle normali funzioni con nome? La prima ragione è che in questo modo si semplifica il codice (anche se magari adesso non sembra!). Infatti si evita di definire una funzione con nome esterna e si scrive il codice direttamente dentro il metodo ready: questo migliora la leggibilità e tracciabilità del codice, in quanto il codice della funzione è immediatamente presente dentro ready e non deve essere cercato in una funzione esterna (che potrebbe trovarsi ovunque).

La ragione però più importante, che fa preferire in generale l'uso delle funzioni anonime, è il fatto che la funzione anonima è un oggetto child dell'oggetto in cui è stata dichiarata. Per esempio nel nostro caso, l'oggetto genitore è document e la funzione è un child di document. In questo modo la funzione può accedere direttamente alle proprietà del genitore, per esempio con la parola chiave this (che abbiamo già incontrato in javascript) e di cui parleremo ancora fra breve.

Viceversa se si usano funzioni esterne con nome, queste sono per default oggetti child di windows, cioè della finestra del browser (in pratica sono esterne al DOM) e dunque non hanno accesso alle proprietà dell'elemento su cui sono state invocate. Torneremo in seguito su questa distinzione molto importante (che ora, necessariamente, non può essere molto chiara).

 

precedente - successiva

Sito realizzato in base al template offerto da

http://www.graphixmania.it