--- title: Array.prototype.find() slug: Web/JavaScript/Reference/Global_Objects/Array/find tags: - Array - ECMAScript 2015 - JavaScript - Metodă - Prototype - Referencja - Tablica - polyfill translation_of: Web/JavaScript/Reference/Global_Objects/Array/find original_slug: Web/JavaScript/Referencje/Obiekty/Array/find --- <p>{{JSRef}}<br> Metoda <strong>find()</strong> zwraca pierwszy element tablicy, który spełnia warunek podanej funkcji testującej.</p> <div>{{EmbedInteractiveExample("pages/js/array-find.html","shorter")}}</div> <ul> <li>Jeśli potrzebujesz <strong>indeksu</strong> znalezionego elementu w tablicy, użyj {{jsxref("Array.findIndex", "findIndex()")}}.</li> <li>Jesli potrzebujesz <strong>indeksu wartości</strong>, użyj {{jsxref("Array.prototype.indexOf()")}}. (Jest to podobne do {{jsxref("Array.findIndex", "findIndex()")}}, ale sprawdza każdy element tablicy pod kątem równości z zadaną wartością, zamiast używać funkcji testującej.)</li> <li>Jeśli chcesz sprawdzić, czy wartość <strong>istnieje</strong> w tablicy, użyj {{jsxref("Array.prototype.includes()")}}. Tutaj także sprawdzana jest równość elementu z zadaną wartością zamiast używania funkcji testującej.</li> <li>Jeśli chcesz znaleźć dowolny element, który spełnia warunek funkcji testującej, użyj {{jsxref("Array.prototype.some()")}}.</li> </ul> <h2 id="Syntax" name="Syntax">Składnia</h2> <pre class="syntaxbox notranslate"><code><var>arr</var>.find(<var>callback</var>[, <var>thisArg</var>])</code></pre> <h3 id="Parameters" name="Parameters">Parametry</h3> <dl> <dt><em><code>callback</code></em></dt> <dd>Funkcja do wykonania przy każdym elemencie tablicy, przyjmująca trzy wartości: <dl> <dt><em><code>element</code></em></dt> <dd>Element obecnie przetwarzany przez funkcję.</dd> <dt><em><code>index</code></em></dt> <dd>Indeks obecnie przetwarzanego elementu.</dd> <dt><em><code>array</code></em></dt> <dd>Tablica, na której wywołano funkcję <code>find</code>.</dd> </dl> </dd> <dt><em><code>thisArg</code></em></dt> <dd>Opcjonalny. Obiekt, który będzie się znajdował pod <code>this</code> w czasie wykonywania funkcji <code>callback</code>.</dd> </dl> <h3 id="Zwracana_wartość">Zwracana wartość</h3> <p><strong>Wartość pierwszego elementu</strong> w tablicy, spełniającego warunek funkcji testującej.<br> W przeciwnym wypadku: {{jsxref("undefined")}}.</p> <h2 id="Description" name="Description">Opis</h2> <p>Metoda <code>find</code> wywołuje funkcję <code><var>callback</var></code> raz dla każdego indeksu tablicy, dopóki nie znajdzie takiego elementu, dla którego <em><code>callback</code></em> zwraca wartość <code>true</code>. Wówczas <code>find</code> natychmiast zwraca wartość tego elementu. W przeciwnym razie, gdy żaden z elementów nie spełni warunków funkcji testującej, <code>find</code> zwraca {{jsxref("undefined")}}.</p> <p><code><var>callback</var></code> jest wywoływany dla każdego indeksu tablicy, nie tylko tych z przypisanymi wartościami. Oznacza to, że może to być mniej efektywne w przypadku tablic rzadkich, w porównaniu z metodami, które odwiedzają jedynie indeksy z przypisanymi wartościami.</p> <p>Jeśli parametr <code><var>thisArg</var></code>jest przekazany do <code>find</code>, będzie użyty jako wartość <code>this</code> w każdym wywołaniu <code><var>callback</var></code>. Jeśli parametr ten nie jest przekazany, używana jest wartość {{jsxref("undefined")}}.</p> <p>Metoda <code>find</code> nie modyfikuje tablicy, na której jest wywoływana, ale może to robić funkcja przekazana do <code><var>callback</var></code>. Jeśli tak się stanie, elementy przetwarzane przez <code>find</code> są ustawiane <em>przed</em> pierwszym wywołaniem funkcji <code><em>callback</em></code>. Zatem:</p> <ul> <li><code><var>callback</var></code> nie odwiedzi żadnych elementów dodanych do tablicy po rozpoczęciu wywowłania <code>find</code>.</li> <li>Jeśli istniejący, jeszcze nieodwiedzony element tablicy jest zmieniony przez <code><em>callback</em></code>, jego wartość przekazana do <code><em>callback</em></code> będzie wartością w momencie, w którym <code>find</code> odwiedza indeks tego elementu.</li> <li>Elementy {{jsxref("delete", "usunięte")}} dalej są odwiedzane.</li> </ul> <h2 id="Polyfill">Polyfill</h2> <p>Metoda ta została dodana do specyfikacji ECMAScript 2015 i może nie być jeszcze dostępna we wszystkich implementacjach języka JavaScript. Niemniej jednak, możesz użyć <em>polyfill</em> z <code>Array.prototype.find</code> z poniższym fragmentem kodu:</p> <pre class="brush: js notranslate">// https://tc39.github.io/ecma262/#sec-array.prototype.find if (!Array.prototype.find) { Object.defineProperty(Array.prototype, 'find', { value: function(predicate) { // 1. Let O be ? ToObject(this value). if (this == null) { throw TypeError('"this" is null or not defined'); } var o = Object(this); // 2. Let len be ? ToLength(? Get(O, "length")). var len = o.length >>> 0; // 3. If IsCallable(predicate) is false, throw a TypeError exception. if (typeof predicate !== 'function') { throw TypeError('predicate must be a function'); } // 4. If thisArg was supplied, let T be thisArg; else let T be undefined. var thisArg = arguments[1]; // 5. Let k be 0. var k = 0; // 6. Repeat, while k < len while (k < len) { // a. Let Pk be ! ToString(k). // b. Let kValue be ? Get(O, Pk). // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)). // d. If testResult is true, return kValue. var kValue = o[k]; if (predicate.call(thisArg, kValue, k, o)) { return kValue; } // e. Increase k by 1. k++; } // 7. Return undefined. return undefined; }, configurable: true, writable: true }); } </pre> <p>Jeśli potrzebujesz wspierać naprawdę przestarzałe silniki JavaScript, które nie wspierająt <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>, najlepiej w ogóle nie używać <em>polyfill</em> z <code>Array.prototype</code>, gdyż nie da się go uczynić niewyliczeniowym.</p> <h2 id="Przykłady">Przykłady</h2> <h3 id="Wyszukiwanie_obiektu_w_tablicy_na_podstawie_jednej_z_jego_własności">Wyszukiwanie obiektu w tablicy na podstawie jednej z jego własności</h3> <pre class="brush: js notranslate">const inventory = [ {name: 'apples', quantity: 2}, {name: 'bananas', quantity: 0}, {name: 'cherries', quantity: 5} ]; function isCherries(fruit) { return fruit.name === 'cherries'; } console.log(inventory.find(isCherries)); // { name: 'cherries', quantity: 5 }</pre> <h4 id="Użycie_funkcji_strzałkowej_i_destrukturyzacja">Użycie funkcji strzałkowej i destrukturyzacja</h4> <pre class="brush: js notranslate">const inventory = [ {name: 'apples', quantity: 2}, {name: 'bananas', quantity: 0}, {name: 'cherries', quantity: 5} ]; const result = inventory.find( ({ name }) => name === 'cherries' ); console.log(result) // { name: 'cherries', quantity: 5 }</pre> <h3 id="Wyszukiwanie_liczby_pierwszej_w_tablicy">Wyszukiwanie liczby pierwszej w tablicy</h3> <p>Poniższy przykładowy kod znajduje element tablicy będący liczbą pierwszą (lub zwraca {{jsxref("undefined")}} jeśli w tablicy nie ma liczby pierwszej):</p> <pre class="brush: js notranslate">function czyPierwsza(element, indeks, tablica) { let start = 2; while (start <= Math.sqrt(element)) { if (element % start++ < 1) { return false; } } return element > 1; } console.log([4, 6, 8, 12].find(czyPierwsza)); // undefined, nie znaleziono console.log([4, 5, 8, 12].find(czyPierwsza)); // 5 </pre> <p>Poniższy przykład pokazuje, że nieistniejące i usunięte elementy <em>są</em> odwiedzane, oraz że wartość przekazana do <code><em>callback</em></code> jest ich wartością, kiedy są odwiedzane:</p> <pre class="brush: js notranslate">// Zadeklaruj tablicę bez elementów przy indeksach 2, 3 i 4 const array = [0,1,,,,5,6]; // Pokazuje wszystkie indeksy, nie tylko te z przypisanymi wartościami array.find(function(value, index) { console.log('Odwiedzono indeks ', index, ' z wartością ', value); }); // Pokazuje wszystkie indeksy, włączając usunięte array.find(function(value, index) { // Usuń element 5 w pierwszej iteracji if (index === 0) { console.log('Usuwanie array[5] z wartością ', array[5]); delete array[5]; } // Element 5 jest wciąż odwiedzany, choć został usunięty console.log('Odwiedzono indeks ', index, ' z wartością ', value); }); // Oczekiwane wyjście: // Usuwanie array[5] z wartością 5 // Odwiedzono indeks 0 z wartością 0 // Odwiedzono indeks 1 z wartością 1 // Odwiedzono indeks 2 z wartością undefined // Odwiedzono indeks 3 z wartością undefined // Odwiedzono indeks 4 z wartością undefined // Odwiedzono indeks 5 z wartością undefined // Odwiedzono indeks 6 z wartością 6 </pre> <h2 id="Specifications" name="Specifications">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('ES2015', '#sec-array.prototype.find', 'Array.prototype.find')}}</td> <td>{{Spec2('ES2015')}}</td> <td>Pierwotna definicja.</td> </tr> </tbody> </table> <h2 id="Browser_compatibility" name="Browser_compatibility">Wsparcie przeglądarek</h2> <div>{{CompatibilityTable}}</div> <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("45.0")}}</td> <td>{{CompatGeckoDesktop("25.0")}}</td> <td>{{CompatNo}}</td> <td>{{CompatNo}}</td> <td>{{CompatSafari("7.1")}}</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>{{CompatNo}}</td> <td>{{CompatNo}}</td> <td>{{CompatGeckoMobile("25.0")}}</td> <td>{{CompatNo}}</td> <td>{{CompatNo}}</td> <td>iOS 8</td> </tr> </tbody> </table> </div> <h2 id="See_also" name="See_also">Zobacz też</h2> <ul> <li>{{jsxref("Array.prototype.findIndex()")}} {{experimental_inline}}</li> <li>{{jsxref("Array.prototype.every()")}}</li> </ul>