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
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
|
---
title: getter
slug: Web/JavaScript/Reference/Functions/get
translation_of: Web/JavaScript/Reference/Functions/get
---
<div>{{jsSidebar("Functions")}}</div>
<div>Składnia <strong>get </strong>łączy właściwość obiektu z funkcją, która będzie wykonywana za każdym razem, kiedy ta właściwość jest wywoływana.</div>
<div></div>
<h2 id="Składnia">Składnia</h2>
<pre class="syntaxbox">{get <em>prop</em>() { ... } }
{get <em>[expression]</em>() { ... } }</pre>
<h3 id="Parametry">Parametry</h3>
<dl>
<dt><code>prop</code></dt>
<dd>Nazwa właściwości, która łączy ją z okresloną funkcją.</dd>
<dt>expression</dt>
<dd>Począwszy od ECMAScript 2015, można również użyć wyrażeń w celu połaczenia funkcji z nazwą właściwości, która jest obliczana.</dd>
</dl>
<h2 id="Opis">Opis</h2>
<p>Czasami pożądane jest aby umożliwić dostęp do właściwości, która zwraca wartość obliczaną dynamicznie lub potrzeba odzwierciedlić stan jakiejś wewnętrznej zmiennej bez potrzeby użycia wyraźnego wywołania metody. W języku JavaScript może to być osiągnięte dzięki użyciu <em>gettera</em>. Nie jest możliwe jednocześnie mieć getter połączony z właściwością i mieć tą właściwość (o takiej samej nazwie jak getter), która faktycznie trzyma wartość. Jednakże jest możliwe aby używać połączenia gettera i settera, żeby utworzyć rodzaj pseudo-właściwości.</p>
<p>Zauważ, że gdy pracujemy ze składnią get to:</p>
<div>
<ul>
<li>Można mieć identyfikator, który jest zarówno typu number jak i string;</li>
<li>Obowiązkowe jest aby zawierała dokładnie zero parametrów (zobacz: "<a href="http://whereswalden.com/2010/08/22/incompatible-es5-change-literal-getter-and-setter-functions-must-now-have-exactly-zero-or-one-arguments/">Niekompatybilna zmiana ES5: literał dla funkcji gettera i setera muszą teraz mieć dokładnie zero albo jeden argumentów</a>", aby uzyskać więcej informacji)</li>
<li>Nie może pojawiać się w literale obiektu z innym getem lub właściwością o takich samych nazwach (<code>{ get x() { }, get x() { } }</code> oraz <code>{ x: ..., get x() { } }</code> są niedozwolone).</li>
</ul>
</div>
<p>Getter może być usunięty poprzez operator <code><a href="/pl/docs/Web/JavaScript/Referencje/Operatory/Operator_delete" title="en/Core_JavaScript_1.5_Reference/Operators/Special_Operators/delete_Operator">delete</a></code>.</p>
<h2 id="Przykłady">Przykłady</h2>
<h3 id="Definiowanie_gettera_na_nowym_obiekcie_w_inicjalizatorze_obiektu.">Definiowanie gettera na nowym obiekcie w inicjalizatorze obiektu.</h3>
<p>To stworzy pseudowłaściwość <code>latest</code> dla obiektu <code>obj</code>, która zwróci ostatnio zalogowany element w tablicy <code>log</code>.</p>
<pre class="brush: js">var obj = {
log: ['test'],
get latest() {
if (this.log.length == 0) return undefined;
return this.log[this.log.length - 1];
}
}
console.log(obj.latest); // Zwróci "test".
</pre>
<p>Zauważ, że usiłowanie przypisania wartości do <code>latest</code> nie zmieni jej.</p>
<h3 id="Usuwanie_gettera_używając_operatora_delete">Usuwanie gettera używając operatora <code>delete</code></h3>
<p>Jeśli chcesz usunąć getter, wystarczy użyć <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete">delete</a> </code>:</p>
<pre class="brush: js">delete obj.latest;
</pre>
<h3 id="Definiowanie_gettera_na_istniejącym_obiekcie_uzywając_defineProperty">Definiowanie gettera na istniejącym obiekcie uzywając <code>defineProperty</code></h3>
<p>Aby dołączyć getter do istniejącego obiektu, można w każdej chwili użyć:<br>
{{jsxref("Object.defineProperty()")}}.</p>
<pre class="brush: js">var o = {a: 0};
Object.defineProperty(o, 'b', { get: function() { return this.a + 1; } });
console.log(o.b) // Uruchamia getter, który otrzymuje yields a + 1 (which is 1)</pre>
<h3 id="Używanie_obliczanych_wartości_dla_właściwości.">Używanie obliczanych wartości dla właściwości.</h3>
<pre class="brush: js">var expr = 'foo';
var obj = {
get [expr]() { return 'bar'; }
};
console.log(obj.foo); // "bar"</pre>
<h3 id="Bystre_samo-nadpisujące_leniwe_gettery">Bystre / samo-nadpisujące / leniwe gettery</h3>
<p>Gettery dają ci możliwośc zdefiniowania właściwości obiektu, ale nie obliczają wartości właściwości dopóki nie jest ona dostępna. Getter odracza koszt obliczania wartości dopóki ta wartość jest potrzebna, a jeśli nigdy nie jest potrzebna, nie ponosi się tego kosztu.</p>
<p>Dodatkową techniką optymalizacyjna aby uleniwić lub opóźnić obliczanie wartości dla właściwości jak i przechować ją na później są <strong>bystre (smart) lub <a href="https://en.wikipedia.org/wiki/Memoization">zmemoizowane</a> gettery.</strong> Wartość jest obliczana gdy getter jest wywoływany za pierwszym razem, a potem jest przechowywana więc kolejne dostępy zwracają zbuforowaną wartość bez jej ponownego obliczania. Jest to użyteczne w następujących sytuacjach:</p>
<ul>
<li>Jeśli obliczanie wartości dla właściwości jest kosztowne (wymaga zużycia dużych zasobów pamięci operacyjnej RAM lub czasu procesora, itd).</li>
<li>Jesli wartość nie jest potrzebna natychmiast. Będzie jednak używana później lub w pewnych przypadkach nie będzie użyta wcale.</li>
<li>Jeżeli jest użyta, będzie wykorzystywana wiele razy i nie ma potrzeby ponownego jej oblczania, oraz jej wartość nigdy nie będzie zmieniona lub ponownie obliczana.</li>
</ul>
<p>To oznacza, że nie powinno się używać leniwych getterów dla właściwości, której wartość może ulec zmianie, ponieważ taki getter nie oblicza właściwości ponownie.</p>
<p>W następującym przykładzie obiekt posiada getter jako swoją właściwość. Otrzymując tą właściwość, jest ona usuwana z obiektu i ponownie dodawana, ale niejawnie jako właściwość z przypisanymi danymi. W ostatecznym rozrachunku zwracana jest wartość.</p>
<pre class="brush: js">get notifier() {
delete this.notifier;
return this.notifier = document.getElementById('bookmarked-notification-anchor');
},</pre>
<p>Na potrzeby kodu Firefoxa, zobacz również moduł z kodem XPCOMUtils.jsm, który okresla funkcje <code><a href="/en-US/docs/Mozilla/JavaScript_code_modules/XPCOMUtils.jsm#defineLazyGetter()">defineLazyGetter()</a></code>.</p>
<h2 id="Specyfikacje">Specyfikacje</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specyfikacje</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('ES5.1', '#sec-11.1.5', 'Object Initializer')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td>Initial definition.</td>
</tr>
<tr>
<td>{{SpecName('ES2015', '#sec-method-definitions', 'Method definitions')}}</td>
<td>{{Spec2('ES2015')}}</td>
<td>Added computed property names.</td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="Zgodność_z_przeglądarkami">Zgodność z przeglądarkami</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatChrome(1)}}</td>
<td>{{ CompatGeckoDesktop("1.8.1") }}</td>
<td>{{ CompatIE(9) }}</td>
<td>9.5</td>
<td>3</td>
</tr>
<tr>
<td>Computed property names</td>
<td>{{CompatChrome(46)}}</td>
<td>{{ CompatGeckoDesktop("34") }}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Chrome for Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{ CompatGeckoMobile("1.8.1") }}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
<tr>
<td>Computed property names</td>
<td>47</td>
<td>{{CompatNo}}</td>
<td>{{ CompatGeckoMobile("34.0") }}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="Zobacz_również">Zobacz również</h2>
<ul>
<li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">setter</a></li>
<li>{{jsxref("Operators/delete", "delete")}}</li>
<li>{{jsxref("Object.defineProperty()")}}</li>
<li>{{jsxref("Object.defineGetter", "__defineGetter__")}}</li>
<li>{{jsxref("Object.defineSetter", "__defineSetter__")}}</li>
<li><a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">Defining Getters and Setters</a> in JavaScript Guide</li>
</ul>
|
