path: root/files/pl/web/javascript/referencje/obiekty/array/find/index.html

---
title: Array.prototype.find()
slug: Web/JavaScript/Referencje/Obiekty/Array/find
tags:
  - Array
  - ECMAScript 2015
  - JavaScript
  - Metodă
  - Prototype
  - Referencja
  - Tablica
  - polyfill
translation_of: Web/JavaScript/Reference/Global_Objects/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 &gt;&gt;&gt; 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 &lt; len
      while (k &lt; 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="https://wiki.developer.mozilla.org/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 }) =&gt; 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 &lt;= Math.sqrt(element)) {
    if (element % start++ &lt; 1) {
      return false;
    }
  }
  return element &gt; 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>