JavaScript zwracająca wartość numeryczną zamiast ciągu (ów) po sortowaniu tablic

Question

Pracuję nad ćwiczeniem, w którym monituję użytkownika o listę nazw, zapisuję listę nazw w tablicy, sortuję tablicę w porządku rosnącym i wydrukuj listę nazwisk (po jednym w wierszu). Kiedy to zrobię, wyświetlana jest wartość liczbowa zamiast jednej nazwy w wierszu. Dlaczego to się dzieje?

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

Podczas korzystania z tego konstruktu:

for (var name in namesArray) { 

wartość name będzie indeks w tablicy (nazwa własności). Jeśli chcesz rzeczywistej wartości w tablicy, trzeba użyć tej nazwy właściciela/indeksu, aby uzyskać wartość:

document.write(namesArray[name]); 

---

Oczywiście, tak naprawdę nie powinny iteracyjne tablice że sposób, w pierwszej kolejności, ponieważ iteruje wszystkie przeliczalne właściwości obiektu tablicy (potencjalnie włączając elementy nieszablonowe), jak widać w this example. Zamiast tego należy użyć tradycyjnego for pętli jak w tym przykładzie kodu, który następuje:

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]); 
    } 

---

Inne opcje dla iteracja tablicę:

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

Albo w ES6, można użyć for/of syntax co faktycznie działa w taki sposób, w jaki próbujesz użyć dla/w:

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

---

Możesz również chcieć zrozumieć, że użycie dokumentu document.write() po przeanalizowaniu i załadowaniu dokumentu spowoduje, że przeglądarka usunie bieżący dokument i rozpocznie nowe. Nie znam szerszego kontekstu, w którym ten kod pasuje, ale może to powodować problemy.

Answer 2

Po pierwsze, w pętli for..in, tutaj name przedstawia klucze i wartości nie w swojej tablicy (należy użyć namesArray[name])

Nie ma też inną ważną rzeczą, aby pamiętać. Tablica nie zaleca się przelotowe za pomocą instrukcji for..in, a jeśli tak, należy zrobić to tak:

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

zwyczajne preferowane sposoby pętli tablicy są następujące:

zwykły dla pętli

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

lub funkcja wyższego rzędu z Array.prototype.forEach (IE9 + jeśli trzeba compat z IE)

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