JavaScript che restituisce valore numerico invece di stringa (s) dopo l'ordinamento dell'array

Question

Sto lavorando a un esercizio in cui viene richiesto all'utente un elenco di nomi, memorizzato l'elenco di nomi in un array, ordinare l'array in ordine crescente e stampare l'elenco dei nomi (uno per riga). Quando lo faccio, vedo un valore numerico visualizzato al posto di un nome per riga. Perché sta succedendo?

var namesArray = []; 

do { 
    var names = prompt("Enter a name: "); 
    namesArray.push(names); 
} while (names != "") 

namesArray.sort(); 

for (var name in namesArray) { 
    document.write(name); 
} 

Answer 1

Quando si utilizza questo costrutto:

for (var name in namesArray) { 

il valore di name sarà l'indice nella matrice (il nome della proprietà). Se si desidera che il valore effettivo della matrice, è necessario utilizzare quel nome di proprietà/indice per ottenere il valore:

document.write(namesArray[name]); 

---

Naturalmente, davvero non dovrebbe scorrere gli array in questo modo, in primo luogo perché che itera tutte le proprietà enumerabili dell'oggetto array (potenzialmente inclusi gli elementi non dell'array) come si può vedere in this example. Invece, è necessario utilizzare un tradizionale for ciclo come in questo esempio di codice che segue:

var namesArray = []; 

    do { 
     var names = prompt("Enter a name: "); 
     namesArray.push(names); 
    } while (names != "") 

    namesArray.sort(); 

    for (var i = 0; i < namesArray.length; i++) { 
     document.write(namesArray[i]); 
    } 

---

Altre opzioni per l'iterazione l'array:

namesArray.forEach(function(value) { 
    document.write(value) 
}); 

Oppure, in ES6, è possibile utilizzare il for/of syntax che funziona veramente come si stava tentando di utilizzare per l'/ a:

for (let value of namesArray) { 
    document.write(value); 
} 

---

Si potrebbe anche voler capire che usando document.write() dopo che il documento è già stato analizzato e caricato farà sì che il browser cancelli il documento corrente e ne inizi uno nuovo. Non conosco il contesto più ampio in cui questo codice si adatta, ma ciò potrebbe causare problemi.

Answer 2

In primo luogo, in un ciclo for..in, qui name rappresenta le chiavi e non i valori nella propria matrice (si dovrebbe usare namesArray[name])

c'è anche un'altra cosa importante da notare. Un array non è raccomandato ad essere passato attraverso l'utilizzo for..in e se è così, si dovrebbe fare in questo modo:

for (var key in array) { 
    if (array.hasOwnProperty(key)) { 
     // then do stuff with array[key] 
    } 
} 

I soliti modi preferiti per scorrere un array sono i seguenti:

A sotto gli occhi di ciclo

for (var i = 0, l = array.length; i < l; i++) { 
    // array[i] 
} 

o una funzione di ordine superiore con Array.prototype.forEach (IE9 + se avete bisogno di compat con IE)

array.forEach(function (item) { 
    // do something with the item 
});