for. . . in
Przechodzi po nazwach wyliczalnych właściwości obiektu, także tych odziedziczonych z prototypu.
Przykład
#const student = { name: 'Ania', level: 3, course: 'JavaScript' }
for (const key in student) {
console.log(`${key}: ${student[key]}`)
}Definicja i zastosowanie
#Pętla for...in w każdym obrocie podaje kolejny klucz obiektu jako napis. Wartość odczytasz przez nawiasy kwadratowe: object[key]. To najstarszy sposób przechodzenia po właściwościach zwykłych obiektów.
Pętla obejmuje też wyliczalne właściwości odziedziczone z prototypu. W zwykłych literałach obiektów rzadko to przeszkadza, ale przy obiektach tworzonych przez Object.create() pojawią się dodatkowe klucze. Odfiltrujesz je warunkiem Object.hasOwn(object, key).
Do tablic for...in się nie nadaje: zwraca indeksy jako napisy ("0", "1") i może złapać dodatkowe właściwości. W nowoczesnym kodzie częściej używa się Object.keys() lub Object.entries() razem z for...of, bo zwracają tylko własne klucze.
Składnia
#for (const key in object) {
// instrukcje
}Więcej przykładów
#const defaults = { theme: 'dark' }
const settings = Object.create(defaults)
settings.sounds = true
for (const key in settings) {
console.log(key, Object.hasOwn(settings, key))
}const points = [10, 20, 30]
for (const index in points) {
console.log(index + 1)
}Indeksy są napisami, więc + 1 skleja tekst zamiast dodawać. Do tablic używaj for...of albo forEach().
const lessons = { b: 'CSS', 2: 'Pętle', a: 'HTML', 1: 'Zmienne' }
for (const key in lessons) {
console.log(key)
}Klucze wyglądające jak liczby całkowite idą najpierw, rosnąco. Pozostałe zachowują kolejność dodania.
Obsługa przeglądarek
#Szeroko dostępne
Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.
- Chrome
- Edge
- Firefox
- Safari
Dobre praktyki
#- Jeśli potrzebujesz tylko własnych kluczy, prościej napisać
for (const key of Object.keys(obj)). Nie trzeba wtedy sprawdzaćObject.hasOwn(). - Nie dodawaj ani nie usuwaj właściwości w trakcie pętli
for...in. Nie ma gwarancji, czy nowe klucze zostaną odwiedzone. - Klucze typu
Symboli właściwości niewyliczalne są pomijane.
Powiązane hasła
#- for...ofPrzechodzi po kolejnych wartościach obiektu iterowalnego: tablicy, napisu, Map, Set i innych.
- Object.keys()Zwraca tablicę nazw własnych, wyliczalnych właściwości obiektu.
- Object.entries()Zwraca tablicę par [klucz, wartość] obiektu.
- Object.hasOwn()Sprawdza, czy obiekt ma własną właściwość o podanej nazwie.
- Object.create()Tworzy nowy obiekt z podanym prototypem.
Widzisz błąd albo brakuje przykładu? Napisz do nas.