Qual è il motivo dietro JSLint dicendo che ci sono "troppi dichiarazioni var"

Question

JSLint (con la bandiera OneVar acceso) è bandiera qualche codice javascript che ho con il seguente:

Problem at line 5 character 15: Too many var statements.

Sono felice di correggere questi errori, ma mi piacerebbe sapere, lo sto facendo per le prestazioni o perché è solo una cattiva pratica e ha un potenziale maggiore per introdurre bug nel mio codice javascript. Qual è la ragione dietro la bandiera di onevar?

Ho dato un'occhiata ai documenti JSLint per il var keyword ma non parla specificamente del perché più istruzioni var nella stessa funzione sono cattive.

Ecco un tentativo di un esempio. Spiegare come il codice beneficerà solo avendo comunicato 1 var:

function Test(arg) { 
    var x = arg + 1, 
     y = cache.GetItem('xyz'); 
    if (y !== null) { 
     // This is what would cause the warning in JSLint 
     var request = ajaxPost(/* Parameters here */); 

    } 
} 

Answer 1

Javascript non ha scopo di blocco. In altre lingue con esso (come c), se dichiari una variabile nell'istruzione if, non puoi accedervi al di fuori di essa, ma in javascript puoi farlo. L'autore di JSLint ritiene che sia una cattiva pratica, dal momento che tu (o altri lettori) potresti sentirti confuso e pensare che non puoi più accedere alla variabile, ma in realtà puoi farlo. Pertanto, dovresti dichiarare tutte le tue variabili nella parte superiore della funzione.

Answer 2

Solo una supposizione qui, ma potrebbe essere il momento per functional decomposition. Le funzioni dovrebbero fare una cosa e farlo bene.

Troppe unità è indicativo di una funzione che sta cercando di fare troppo. O un caso in cui dovresti usare un array.

Answer 3

Se l'opzione "onevar" è impostata su true se è consentita una sola istruzione var per funzione.

if (funct['(onevar)'] && option.onevar) { 
    warning("Too many var statements."); 
} 

Answer 4

L'idea è che è necessario utilizzare un oggetto anziché le singole vars. Allora, dove avete ottenuto:

var x = arg + 1, 
    y = cache.GetItem('xyz'); 

modificarla in:

var dimensions = {}; 
dimensions.x = arg + 1; 
dimensons.y = cache.GetItem('xyz'); 
dimensions.request = ... 

È quindi possibile accedere a queste variabili attraverso l'oggetto, la sua più ordinato di avere un oggetto per la funzione di contenere che le variabili funzioni. Quindi non riceverai l'avviso.

Answer 5

Basta dichiarare le Vars in un posto come questo:

var request,x,y; 

Answer 6

La motivazione ufficiale is here, da Douglas Crockford.

Per citare:

In molte lingue, un blocco introduce un ambito. Le variabili introdotte in un blocco non sono visibili al di fuori del blocco.

In JavaScript, i blocchi non introducono un ambito. C'è solo lo scope di funzione . Una variabile introdotta ovunque in una funzione è visibile ovunque nella funzione. I blocchi di JavaScript confondono i programmatori con esperienza e causano errori perché la sintassi familiare fa una falsa promessa.

JSLint prevede blocchi con le funzioni, if, switch, while, for, do e try statements e nessun altro.

Nelle lingue con ambito di blocco, in genere si consiglia di dichiarare le variabili nel sito di primo utilizzo. Ma poiché JavaScript non ha scope di blocco, è più saggio dichiarare tutte le variabili di una funzione nella parte superiore della funzione. Si consiglia di utilizzare un'unica istruzione var per funzione. Questo può essere rifiutato con l'opzione vars .

Answer 7

Il ragionamento è già descritto.

raccomandazione è di usare questa forma:

var myVar1 = document.getElementById("myDiv1"), 
    myVar2 = document.getElementById("myDiv2"); 

o questo:

var myVar1, myVar2; 
myVar1 = document.getElementById("myDiv1"); 
myVar2 = document.getElementById("myDiv2"); 

Ma questo non sembra molto bello, soprattutto se si desidera documentare Vars.

Quindi è possibile disabilitare temporaneamente l'avviso:

/*jslint vars: true*/ 
    /** 
    * @returns {HTMLDivElement} 
    */ 
    var myVar1 = document.getElementById("myDiv1"); 
    /** 
    * @returns {HTMLDivElement} 
    */ 
    var myVar2 = document.getElementById("myDiv2"); 
    /*jslint vars: false*/ 

Attenzione: assicurarsi che questo è fatto nella parte superiore di una funzione.

Penso che ciò sia possibile perché jslint non è in grado di determinare in modo affidabile se i var sono stati dichiarati nella parte superiore della funzione o meno.