2011-12-25 13 views
5

Domanda di javascript - una delle seguenti è la migliore pratica e la performance amichevole, accogliamo con favore anche altri suggerimenti. Questa è la versione più semplice del progetto originale. Ci saranno 20+ variabili e 10+ funzioni interne (Es: 'processo' nel caso).Javascript - Argomenti V funzioni annidate Vs Prestazioni

Il vantaggio del Metodo 1 è che non è necessario inviare argomenti alle funzioni ma come annida tutte le funzioni all'interno della funzione principale (possibilmente rigenerare tutte le funzioni interne per ogni istanza di Foo). Mentre il metodo 2 è libero dalla nidificazione delle funzioni ma richiede molti argomenti. Si noti che inoltre ci sarà più istanza di costruttore Foo.

Metodo 1:

function Foo() { 
    var a = 1; 
    var b = 2; 
    var c = (a+b)/2; 
    var $element = $('#myElement'); 

    var process = function(){ 
     var x = a+b+c; 
     $element.css('left', x) 
     return x; 
    } 
    x = process(); 
} 

Metodo 2:

function Foo() { 
    var a = 1; 
    var b = 2; 
    var c = (a+b)/2; 
    var $element = $('#myElement'); 
    x = process (a, b, c, $element); 
} 

function process (a, b, c, $element){ 
    $element.css('left', x) 
    return x; 
} 

risposta

4

Le funzioni separate sono sicuramente la strada da percorrere per le prestazioni. Mentre ci sono situazioni in cui la variabile scope delle funzioni annidate sarebbe piacevole da avere, il successo delle prestazioni può essere enorme se la funzione è grande.

Ricordare che ogni volta che Foo viene chiamato, il processo var sta riallocando tutta la memoria per la nuova funzione che si sta creando, piuttosto che mantenere la funzione in memoria e passare semplicemente i nuovi parametri. Se la funzione è grande, questo sarà un compito piuttosto intenso per l'interprete Javascript.

Ecco alcuni numeri duri che possono aiutare pure (Contiene confronto delle prestazioni e parametri di riferimento effettivi che è possibile eseguire nel proprio browser): http://jsperf.com/nested-functions-speed, http://jsperf.com/nested-named-functions/5

+0

Sì, le funzioni separate offrono prestazioni migliori anche con un numero maggiore di argomenti. Grazie per la risposta. – user1106995

2

In realtà i browser si ottimizzano anche le funzioni nidificate per cui le differenze di prestazioni rispetto le funzioni dichiarate nell'ambito esterno diventano trascurabili.

Ho bloggato my findings e creato un performance test per supportare questo reclamo.

MODIFICA: il test è stato interrotto, after fixing il test mostra che è ancora più veloce non annidare le funzioni.

+0

Hmm ... sono leggermente peggiori, ma considero questo un punto debole dei browser. È molto più bello scrivere codice annidato! Lo adoro! Vorrei che tutte le lingue lo supportassero e ottimizzato per questo quando vengono utilizzate variabili non locali. – momomo

Problemi correlati