1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
|
---
title: for...in
slug: Web/JavaScript/Reference/Statements/for...in
tags:
- JavaScript
- wyrażenie
translation_of: Web/JavaScript/Reference/Statements/for...in
original_slug: Web/JavaScript/Referencje/Polecenia/for...in
---
<div>{{jsSidebar("Statements")}}</div>
<p><strong>Wyrażenie</strong> <strong><code>for...in</code> </strong>iteruje po nazwach wszystkich <a href="/pl/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">wyliczalnych</a> własnościach obiektu, włączając w to odziedziczone wyliczalne właściwości. <strong><code>for...in</code></strong> pomija te właściwości, które są indeksowane <a href="/pl/docs/Web/JavaScript/Referencje/Obiekty/Symbol">Symbol</a>ami.</p>
<div>{{EmbedInteractiveExample("pages/js/statement-forin.html")}}</div>
<h2 id="Składnia">Składnia</h2>
<pre class="syntaxbox notranslate">for (<em>zmienna</em> in <var>obiekt</var>)
polecenie</pre>
<dl>
<dt><code>zmienna</code></dt>
<dd>W każdej iteracji, <em>zmiennej</em> przypisywana jest inna nazwa własności.</dd>
<dt><code>obiekt</code></dt>
<dd>Obiekt, po którego niesymbolicznych wyliczalnych własnościach iterujemy.</dd>
</dl>
<h2 id="Opis">Opis</h2>
<p><code>for...in</code> iteruje jedynie po wyliczalnych i jednocześnie niesymbolicznych właściwościach. Obiekty utworzone za pomocą wbudowanych konstruktorów (np. <code>Array</code> czy <code>Object</code>) dziedziczą niewyliczalne właściwości z m.in. <code>Object.protoype</code> oraz <code>String.prototype</code>, takie jak metoda {{jsxref("String.indexOf", "indexOf()")}} ze {{jsxref("String")}} albo {{jsxref("Object.toString", "toString()")}} z {{jsxref("Object")}}. Pętla przejdzie przez wszystkie wyliczalne właściwości – zarówno własne, jak i odziedziczone z prototypu konstruktora.</p>
<h3 id="Usunięte_dodane_lub_zmodyfikowane_własności">Usunięte, dodane lub zmodyfikowane własności</h3>
<p>Pętla <code>for...in</code> iteruje po właściwościach w arbitralnej kolejności (zobacz więcej w opisie operatora {{jsxref("Operators/delete", "delete")}}, dlaczego nie można liczyć na konkretną kolejność właściwości – szczególnie w różnych przeglądarkach).</p>
<p>Jeśli właściwość zostanie zmodyfikowana w danej iteracji, a dopiero następnie odwiedzona przez <code>for...in</code>, przyjmuje tę późniejszą wartość. Usunięcie właściwości przed jej odwiedzeniem przez pętlę, spowoduje, że nie wystąpi w żadnej z późniejszych iteracji. Natomiast właściwość dodana do obiektu w trakcie iterowania może (ale nie musi) zostać odwiedzona przez pętlę.</p>
<p>Ogólnie, w trakcie iterowania z użyciem <code>for...in</code> najlepiej jest nie modyfikować innych właściwości obiektu niż ta, która jest aktualnie odwiedzona. Nie ma żadnej gwarancji, że dodana właściwość zostanie odwiedzona, ani że właściwość usuwana zostanie odwiedzona przed skasowaniem. Podobnie, nie ma gwarancji, czy właściwość zmodyfikowana zostanie odwiedzona przed, czy po modyfikacji.</p>
<h3 id="Iterowanie_po_tablicy_i_for...in">Iterowanie po tablicy i for...in</h3>
<div class="note">
<p><strong>Uwaga:</strong> wyrażenie <code>for...in</code> nie powinno być używane na obiektach klasy{{jsxref("Array")}}, gdzie kolejność elementów jest ważna.</p>
</div>
<p>Indeksy tablic są niczym innym jak właściwościami obiektu – z tym, że ich nazwy są liczbowe, a nie słowne. Dlatego nie ma gwarancji, że <code>for...in</code> odwiedzi je w jakiejkolwiek konkretnej kolejności. Ponadto, pętla zwróci także nieliczbowe właściwości oraz te odziedziczone.</p>
<p>Kiedy kolejność odwiedzania elementów ma znaczenie, iterowanie po elementach tablicy powinno odbywać się z użyciem pętli {{jsxref("Statements/for", "for")}} (albo {{jsxref("Array.prototype.forEach()")}} albo pętli {{jsxref("Statements/for...of", "for...of")}}), ze względu na to, że kolejność iterowania po właściwościach jest zależna od implementacji.</p>
<h3 id="Iterowanie_jedynie_po_własnych_właściwościach">Iterowanie jedynie po własnych właściwościach</h3>
<p>Jeżeli potrzebujesz iterować tylko po własnych właściwościach obiektu, użyj {{jsxref("Object.getOwnPropertyNames", "getOwnPropertyNames()")}}, albo sprawdzaj za każdym razem, czy właściwość jest właściwością własną za pomocą {{jsxref("Object.prototype.hasOwnProperty", "hasOwnProperty()")}}({{jsxref("Object.prototype.propertyIsEnumerable", "propertyIsEnumerable()")}} również moży zostać użyte). Alternatywnie, jeśli jesteś pewien, że nie spowoduje to problemów w kodzie, możesz rozszerzyć wbudowane prototypy o metodę sprawdzającą, czy właściwość jest własna.</p>
<h2 id="Dlaczego_używać_for...in">Dlaczego używać for...in?</h2>
<p>Skoro pętla <code>for...in</code> została stworzona do iterowania po właściwościach obiektu i nie jest zalecana do pracy z tablicami, to jaki może bć z niej pożytek?</p>
<p>Najbardziej praktyczna jest w sytuacjach związanych z debugowaniem, zapewniając łatwy sposób na sprawdzenie właściwości obiektu (wypisując je do konsoli lub gdziekolwiek indziej). Oprócz tego, są sytuacje, kiedy pary klucz-wartość są indeksowane innym typem niż liczba. Wtedy po takim "słowniku" można przeiterować za pomocą <code>for...in</code>.</p>
<h2 id="Przykłady">Przykłady</h2>
<h3 id="Użycie_for...in">Użycie for...in</h3>
<p>Pętla <code>for...in</code> poniżej iteruje po wszystkich wyliczalnych właściwościach obiektu <code>obj</code> i wypisuje je do konsoli.</p>
<pre class="brush: js notranslate">var obj = {a: 1, b: 2, c: 3};
for (const prop in obj) {
console.log(`obj.${prop} = ${obj[prop]}`);
}
// Wyjście:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"</pre>
<h3 id="Iterowanie_po_własnych_właściwościach">Iterowanie po własnych właściwościach</h3>
<p>Następny przykład pokazuje użycie {{jsxref("Object.prototype.hasOwnProperty", "hasOwnProperty()")}}, aby nie wyświetlać właściwości odziedziczonych przez <code>ColoredTriangle</code>.</p>
<pre class="brush: js notranslate">var triangle = {a: 1, b: 2, c: 3};
function ColoredTriangle() {
this.color = 'red';
}
ColoredTriangle.prototype = triangle;
var obj = new ColoredTriangle();
for (const prop in obj) {
if (obj.hasOwnProperty(prop)) {
console.log(`obj.${prop} = ${obj[prop]}`);
}
}
// Wyjście:
// "obj.color = red"
</pre>
<h2 id="Specyfikacje">Specyfikacje</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specyfikacja</th>
<th scope="col">Status</th>
<th scope="col">Komentarz</th>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'for...in statement')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES6', '#sec-for-in-and-for-of-statements', 'for...in statement')}}</td>
<td>{{Spec2('ES6')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES5.1', '#sec-12.6.4', 'for...in statement')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES3', '#sec-12.6.4', 'for...in statement')}}</td>
<td>{{Spec2('ES3')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES1', '#sec-12.6.3', 'for...in statement')}}</td>
<td>{{Spec2('ES1')}}</td>
<td>Definicja początkowa.</td>
</tr>
</tbody>
</table>
<h2 id="Zgodność_z_przeglądarkami">Zgodność z przeglądarkami</h2>
<p>{{Compat("javascript.statements.for_in")}}</p>
<h3 id="Zgodność_Wyrażenie_incjalizujące_w_trybie_ścisłym">Zgodność: Wyrażenie incjalizujące w trybie ścisłym</h3>
<p>Przed Firefoksem 40, było możliwe używanie wyrażenia incjalizującego (<code>i=0</code>) w pętli <code>for...in</code>:</p>
<pre class="brush: js example-bad notranslate">var obj = {a: 1, b: 2, c: 3};
for (var i = 0 in obj) {
console.log(obj[i]);
}
// 1
// 2
// 3
</pre>
<p>To niestandardowe zachowanie jest ignorowane począwszy od wersji 40 i powoduje zgłoszenie błędu {{jsxref("SyntaxError")}} ("<a href="/en-US/docs/Web/JavaScript/Reference/Errors/Invalid_for-in_initializer">for-in loop head declarations may not have initializers</a>") w <a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode">trybie ścisłym</a> ({{bug(748550)}} i {{bug(1164741)}}).</p>
<p>Inne silniki, takie jak v8 (Chrome), Chakra (IE/Edge), i JSC (WebKit/Safari) również mogą przestać obsługiwać taką konstrukcję.</p>
<h2 id="Zobacz_też">Zobacz też</h2>
<ul>
<li>{{jsxref("Statements/for...of", "for...of")}} – podobna konstrukcja, która iteruje po <em>wartościach </em>właściwości</li>
<li>{{jsxref("Statements/for_each...in", "for each...in")}} {{deprecated_inline}} – wyrażenie analogiczne do <code>for...of</code>, ale zdeprecjonowane</li>
<li>{{jsxref("Statements/for", "for")}}</li>
<li><a href="/pl/docs/Web/JavaScript/Guide/Iterators_and_Generators">Wyrażenia generatora</a> (używają składni <code>for...in</code>)</li>
<li><a href="/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">Reguły wyliczalności i własności właściwości</a></li>
<li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
<li>{{jsxref("Object.prototype.hasOwnProperty()")}}</li>
<li>{{jsxref("Array.prototype.forEach()")}}</li>
</ul>
|
