2013-04-08 17 views
17

Ho la seguente funzione diQual è la differenza tra una chiamata di funzione e un riferimento alla funzione?

function hello() { 
alert("hi!"); 
} 

prendere questo pezzo di codice:

var elem = document.getElementById("btn"); 
elem.onclick = hello; 

La mia domanda potrebbe essere un po 'difficile da capire, in modo da portare con me: Cosa differenzia proprio questo pezzo di codice da una chiamata normale, o cosa rende questo pezzo di codice richiede un riferimento alla variabile funzione piuttosto che una normale chiamata? (hello();)

Come posso sapere dove dovrei dare un riferimento alla funzione e quando dovrei effettivamente chiamarla?

+0

Posso sbagliarmi, nuovo a questi linguaggi dinamici (appena iniziato a guardare Python) , ma penso che il riferimento sia quando si desidera creare un alias per la funzione e la chiamata è letteralmente quando si desidera chiamare. (Ad esempio 'var = hello' quindi' var() 'equivale a chiamare' hello() 'ovunque' var() 'è chiamato – SGM1

risposta

23

Bene, la proprietà onclick prevede un riferimento a una funzione, che deve essere eseguita quando si fa clic sull'elemento. Normalmente è uno:

element.onclick = funcRef; 

o

element.onclick = function() { 
    funcRef(); 
}; 

(ma, naturalmente, è meglio usare addEventListener e attachEvent)

Notate come entrambi sono i riferimenti alle funzioni, non chiamare.

Quando qualcosa si aspetta un riferimento, non lo si chiama ... si assegna un riferimento ad esso (primo esempio).

Quando si desidera chiamare specificamente una funzione, la si chiama con () (secondo esempio). Ma notate come nel secondo esempio ci sia ancora un riferimento a una funzione assegnata a onclick - è solo una funzione anonima.

Probabilmente la parte più importante:

Alcune persone pensano che si vuole fare questo:

element.onclick = funcRef(); 

Ma che esegue immediatamente la funzione (a causa del ()), e assegna il suo valore di ritorno a onclick. A meno che il valore di ritorno sia una funzione,, questo non è ciò che desideri.

Penso che la morale della storia sia che quando vuoi/hai bisogno di qualcosa da eseguire in questo momento, chiami la funzione. Se la funzione è richiesta per un uso successivo o per esigenze archiviate, non la si chiama.

+3

Il ** ** esecuzione immediata bit è molto importante – Wex

+0

@Wex Haha yeah Mi è sembrato di indebolirlo più. – Ian

+0

C'è un caso d'angolo interessante: 'element.onclick = getClickHandler()' –

11

Come posso sapere dove dovrei dare un riferimento alla funzione e quando dovrei effettivamente chiamarla?

Avete bisogno di eseguire la funzione ora?

che aggiungere il() per eseguirlo

Avete bisogno di funzionare a cui fa riferimento così è chiamato più tardi?

Non aggiungere il().

1

Un riferimento alla funzione è necessario in qualche punto indipendentemente da come viene chiamato. La differenza qui è che non si sta chiamando esplicitamente la funzione hello. Assegnare un riferimento a tale funzione al gestore di eventi elem del nodo DOM onclick in modo che quando viene attivato onclick per quel nodo, la funzione venga richiamata.

1

ciao() significa che si chiama quella funzione, il che significa che la funzione verrà eseguita direttamente.

mentre quando hai elem.onclick = ciao, questo è chiamato callback. Dove ciao non viene eseguito direttamente ma solo quando viene attivato un determinato evento (in questo caso quando c'è un clic sull'elemento)

15

Vuoi eseguirlo ORA? Quindi chiamalo.

a=hello() significa "Chiama hello() ASAP e imposta il valore di ritorno su a".

D'altra parte, a=hello significa "a è un alias per hello. Se si chiama a(), si ottengono gli stessi risultati come chiamare hello()"

si utilizza quest'ultimo per callback, ecc, in cui si desidera dire al browser cosa vuoi che succeda dopo che si è verificato un evento. Ad esempio, potresti voler dire "chiama hello() quando l'utente fa clic" (come nell'esempio). Oppure, "Quando la query AJAX restituisce un risultato, chiamare la funzione callback() sui dati restituiti".

2

Praticamente tutte le istruzioni in JavaScript hanno un valore di ritorno. Se non diversamente specificato, le funzioni in JavaScript restituiscono undefined quando vengono chiamate. Quindi, l'unico contesto in cui avrebbe senso per chiamare la funzione in questo assegnamento se dovesse restituire una funzione di:

function hello() { 
    return function() { 
     alert("hi!"); 
    } 
} 

elem.onclick = hello(); 
Problemi correlati