---
title: Map
slug: Web/JavaScript/Reference/Global_Objects/Map
tags:
  - ECMAScript 2015
  - JavaScript
  - Map
translation_of: Web/JavaScript/Reference/Global_Objects/Map
original_slug: Web/JavaScript/Referencje/Obiekty/Map
---
<div>{{JSRef}}</div>

<p><strong>Map </strong>jest prostym obiektem mapującym klucze na wartości. Każdy element (zarówno obiekt jak i {{Glossary("Primitive", "wartości proste")}}) mogą być użyte zarówno jako klucz jak i wartość.</p>

<h2 id="Składnia">Składnia</h2>

<pre class="syntaxbox notranslate">new Map([iterable])</pre>

<h3 id="Parametry">Parametry</h3>

<dl>
 <dt><code>iterable</code></dt>
 <dd>Iterable jest tablicą lub innym iterowalnym obiektem, którego elementy są parami typu klucz-wartość (np. 2 elementowa tablica). Każda para klucz-wartość jest dodawana do obiektu new Map. <code>null</code> jest traktowane jako <code>undefined.</code></dd>
</dl>

<h2 id="Opis">Opis</h2>

<p>Obiekt Map iteruje swoje elementy we wprowadzonej kolejności — pętla {{jsxref("Statements/for...of", "for...of")}} zwraca tablicę  <code>[key, value] </code>dla każdej iteracji.</p>

<p>Należy pamiętać, że kolejność iteracji dla <code>Map</code> mapującej obiekty, w szczególności np. dla słownika słowników, odzwieciedlać będzie jedynie kolejność dodawania obiektów do kolekcji, natomiast kolejność dodawania elementów do samych obiektów nie jest gwarantowana i powinna być traktowana jako losowa.</p>

<h3 id="Równość_kluczy">Równość kluczy</h3>

<p>Klucze porównywane są według algorytmu "same-value" (tej samej wartości).</p>

<p><code>NaN</code> jest traktowana jako równa <code>NaN</code> (mimo tego, że <code>NaN !== NaN</code>). Wszystkie inne wartości są uważane za równe zgodnie z semantyką <code>===</code>  operatora równości.</p>

<p>W obecnej specyfikacji ECMAScript <code>-0 === +0</code>, choć wcześniejsze propozycje zakładały inne zachowanie, co zaowocowało implementacją w niektórych wersjach przeglądarek. Szczegóły zawarte są w  "Value equality for -0 and 0"  w tabeli <a href="https://developer.mozilla.org/pl/docs/Web/JavaScript/Referencje/Obiekty/Map$edit#Browser_compatibility">kompatybilności przeglądarek</a>.</p>

<h3 id="Porównanie_Obiektów_i_Map">Porównanie Obiektów i Map</h3>

<p>{{jsxref("Object", "Obiekty")}} są podobne do Map. W obu przypadkach pozwalają ustawić klucze dla wartości, zwracają te wartości, usuwają klucze i wykrywają czy coś jest przechowywane jako klucz. Z tego powodu (i ponieważ nie było innych wbudowanych alternatyw), <code>Object</code>  był używany wcześniej jako <code>Map</code>. Istnieją jednak ważne różnice pomiędzy <code>Obiektami</code> i <code>Mapami</code>, które powodują, że <code>Map</code> jest lepszym wyborem w pewnych przypadkach:</p>

<ul>
 <li>Klucze obiektu są {{jsxref("String", "Stringami")}}' i {{jsxref("Symbol", "Symbolami")}}, podczas gdy dla <code>Map</code> mogą być dowolną wartością, włączając w to funkcje, obiekty czy wartości proste.</li>
 <li>Można łatwo pobrać wielkość mapy używając właściwości <code>size</code>, podczas gdy wielkość obiektu musi być określana ręcznie.</li>
 <li>Po mapie można iterować bezpośrednio, iteracja po obiekcie wymaga pobrania jego kluczy i iteracji po ich liście.</li>
 <li>Obiekt posiada prototyp, istnieją więc domyślne klucze, które mogą kolidować z Twoimi kluczami, jeśli nie jesteś ostrożny. Można ominąć ten problem używając <code>Object.create(null)</code> (dostępne od ES5), ale było to rzadko stosowane rozwiązanie.</li>
 <li>Mapa może osiągnąć lepszą wydajność w scenariuszu, w którym często dodajemy i usuwamy pary klucz-wartość.</li>
</ul>

<p>Nie oznacza to, że powinno się używać <code>Maps</code> wszędzie. Obiekty są wciąż używane w większości przypadków.  Instancje <code>Map</code> są użyteczne dla kolekcji, warto rozważyć ich zaadaptowanie jedynie w przypadkach, gdy wcześniej używano dla nich obiektów. Obiekty powinny być używane jako rejestr z polami i metodami. Jeśli wciąż nie jesteś pewien czego użyć, pomocne mogą okazać się poniższe pytania:</p>

<ul>
 <li>Czy klucze są nieznane do momentu uruchomienia programu? Czy potrzebujesz wyszukiwać lub tworzyć je dynamicznie?</li>
 <li>Czy wszystkie wartości mają ten sam typ? Czy mogą być użyte wymiennie?</li>
 <li>Czy potrzebujesz kluczy, które nie są typu string?</li>
 <li>Czy pary klucz-wartość są często dodawane lub usuwane?</li>
 <li>Czy kolekcja powinna być iterowalna?</li>
</ul>

<p>Jeśli odpowiedziałeś 'tak' na którekolwiek z tych pytań, prawdopodobnie powinieneś użyć <code>Map</code>. I przeciwnie, jeśli masz zamknięty zbiór kluczy, jeśli musisz odwoływać się do poszczególnych, specyficznych kluczy a każdy z nich ma swoje, odrębne od innych znaczenie, najprawdopodobniej potrzebujesz obiektu.</p>

<h2 id="Własności">Własności</h2>

<dl>
 <dt><code>Map.length</code></dt>
 <dd>Wartość <code>length</code>  jest zawsze równa 0.</dd>
 <dt>{{jsxref("Map.@@species", "get Map[@@species]")}}</dt>
 <dd>Funkcja konstruktora używana do tworzenia obiektów pochodnych.</dd>
 <dt>{{jsxref("Map.prototype")}}</dt>
 <dd>Reprezentuje prototyp funkcji konstruktora <code>Map</code>. Pozwala rozszerzać prototyp wszystkich obiektów <code>Map</code> o własne własności.</dd>
</dl>

<h2 id="Instancje_Map">Instancje <code>Map</code></h2>

<p>Wszystkie instancje <code>Map</code>  dziedziczą po {{jsxref("Map.prototype")}}.</p>

<h3 id="Własności_2">Własności</h3>

<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Map/prototype','Properties')}}</p>

<h3 id="Metody">Metody</h3>

<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Map/prototype','Methods')}}</p>

<h2 id="Przykłady">Przykłady</h2>

<h3 id="Używanie_obiektu_typu_Map">Używanie obiektu typu <code>Map</code></h3>

<pre class="brush: js notranslate">var myMap = new Map();

var keyString = 'a string',
    keyObj = {},
    keyFunc = function() {};

// setting the values
myMap.set(keyString, "value associated with 'a string'");
myMap.set(keyObj, 'value associated with keyObj');
myMap.set(keyFunc, 'value associated with keyFunc');

myMap.size; // 3

// getting the values
myMap.get(keyString);    // "value associated with 'a string'"
myMap.get(keyObj);       // "value associated with keyObj"
myMap.get(keyFunc);      // "value associated with keyFunc"

myMap.get('a string');   // "value associated with 'a string'"
                         // because keyString === 'a string'
myMap.get({});           // undefined, because keyObj !== {}
myMap.get(function() {}) // undefined, because keyFunc !== function () {}
</pre>

<h3 id="Użycie_NaN_jako_kluczy_w_Map">Użycie <code>NaN</code> jako kluczy w  <code>Map</code></h3>

<p><code>NaN</code> can also be used as a key. Even though every <code>NaN</code> is not equal to itself (<code>NaN !== NaN</code> is true), the following example works, because <code>NaN</code>s are indistinguishable from each other:</p>

<pre class="brush: js notranslate">var myMap = new Map();
myMap.set(NaN, 'not a number');

myMap.get(NaN); // "not a number"

var otherNaN = Number('foo');
myMap.get(otherNaN); // "not a number"
</pre>

<h3 id="Iteracja_po_Map_przy_użyciu_for..of">Iteracja po <code>Map</code> przy użyciu <code>for..of</code></h3>

<pre class="brush: js notranslate">var myMap = new Map();
myMap.set(0, 'zero');
myMap.set(1, 'one');
for (var [key, value] of myMap) {
  console.log(key + ' = ' + value);
}
// 0 = zero
// 1 = one

for (var key of myMap.keys()) {
  console.log(key);
}
// 0
// 1

for (var value of myMap.values()) {
  console.log(value);
}
// zero
// one

for (var [key, value] of myMap.entries()) {
  console.log(key + ' = ' + value);
}
// 0 = zero
// 1 = one
</pre>

<h3 id="Iteracja_po_Map_przy_użyciu_forEach">Iteracja po <code>Map</code> przy użyciu <code>forEach()</code></h3>

<pre class="brush: js notranslate">myMap.forEach(function(value, key) {
  console.log(key + ' = ' + value);
});
// Will show 2 logs; first with "0 = zero" and second with "1 = one"
</pre>

<h3 id="Relacja_do_obiektów_typu_Array">Relacja do obiektów typu <code>Array</code></h3>

<pre class="brush: js notranslate">var kvArray = [['key1', 'value1'], ['key2', 'value2']];

// Use the regular Map constructor to transform a 2D key-value Array into a map
var myMap = new Map(kvArray);

myMap.get('key1'); // returns "value1"

// Use the spread operator to transform a map into a 2D key-value Array.
console.log(uneval([...myMap])); // Will show you exactly the same Array as kvArray

// Or use the spread operator on the keys or values iterator to get
// an array of only the keys or values
console.log(uneval([...myMap.keys()])); // Will show ["key1", "key2"]
</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('ES2015', '#sec-map-objects', 'Map')}}</td>
   <td>{{Spec2('ES2015')}}</td>
   <td>Początkowa definicja</td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-map-objects', 'Map')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="Kompatybilność_przeglądarek">Kompatybilność przeglądarek</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Edge</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>
    <p>{{ CompatChrome(38) }} [1]</p>
   </td>
   <td>12</td>
   <td>{{ CompatGeckoDesktop("13") }}</td>
   <td>11</td>
   <td>25</td>
   <td>7.1</td>
  </tr>
  <tr>
   <td>Constructor argument: <code>new Map(iterable)</code></td>
   <td>{{ CompatChrome(38) }}</td>
   <td>12</td>
   <td>{{ CompatGeckoDesktop("13") }}</td>
   <td>{{CompatNo}}</td>
   <td>25</td>
   <td>{{CompatSafari("9")}}</td>
  </tr>
  <tr>
   <td>iterable</td>
   <td>{{ CompatChrome(38) }}</td>
   <td>12</td>
   <td>{{ CompatGeckoDesktop("17") }}</td>
   <td>{{CompatNo}}</td>
   <td>25</td>
   <td>7.1</td>
  </tr>
  <tr>
   <td><code>Map.clear()</code></td>
   <td>{{ CompatChrome(31) }}<br>
    {{ CompatChrome(38) }}</td>
   <td>12</td>
   <td>{{CompatGeckoDesktop("19")}}</td>
   <td>11</td>
   <td>25</td>
   <td>7.1</td>
  </tr>
  <tr>
   <td><code>Map.keys(), Map.values(), Map.entries()</code></td>
   <td>{{ CompatChrome(37) }}<br>
    {{ CompatChrome(38) }}</td>
   <td>12</td>
   <td>{{CompatGeckoDesktop("20")}}</td>
   <td>{{CompatNo}}</td>
   <td>25</td>
   <td>7.1</td>
  </tr>
  <tr>
   <td><code>Map.forEach()</code></td>
   <td>{{ CompatChrome(36) }}<br>
    {{ CompatChrome(38) }}</td>
   <td>12</td>
   <td>{{CompatGeckoDesktop("25")}}</td>
   <td>11</td>
   <td>25</td>
   <td>7.1</td>
  </tr>
  <tr>
   <td>Key equality for -0 and 0</td>
   <td>{{ CompatChrome(34) }}<br>
    {{ CompatChrome(38) }}</td>
   <td>12</td>
   <td>{{CompatGeckoDesktop("29")}}</td>
   <td>{{CompatNo}}</td>
   <td>25</td>
   <td>{{CompatSafari("9")}}</td>
  </tr>
  <tr>
   <td>Constructor argument: <code>new Map(null)</code></td>
   <td>{{CompatVersionUnknown}}</td>
   <td>12</td>
   <td>{{CompatGeckoDesktop("37")}}</td>
   <td>11</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatSafari("9")}}</td>
  </tr>
  <tr>
   <td>Monkey-patched <code>set()</code> in Constructor</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>12</td>
   <td>{{CompatGeckoDesktop("37")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatSafari("9")}}</td>
  </tr>
  <tr>
   <td><code>Map[@@species]</code></td>
   <td>{{CompatChrome("51")}}</td>
   <td>13</td>
   <td>{{CompatGeckoDesktop("41")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatOpera("38")}}</td>
   <td>{{CompatSafari("10")}}</td>
  </tr>
  <tr>
   <td><code>Map()</code> without <code>new</code> throws</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>12</td>
   <td>{{ CompatGeckoDesktop("42") }}</td>
   <td>11</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatSafari("9")}}</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>{{ CompatChrome(38) }} [1]</td>
   <td>{{ CompatGeckoMobile("13") }}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>8</td>
  </tr>
  <tr>
   <td>Constructor argument: <code>new Map(iterable)</code></td>
   <td>{{CompatNo}}</td>
   <td>{{ CompatChrome(38) }}</td>
   <td>{{ CompatGeckoMobile("13") }}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>9</td>
  </tr>
  <tr>
   <td>iterable</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{ CompatGeckoMobile("17") }}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>8</td>
  </tr>
  <tr>
   <td><code>Map.clear()</code></td>
   <td>{{CompatNo}}</td>
   <td>{{ CompatChrome(31) }}<br>
    {{ CompatChrome(38) }}</td>
   <td>{{CompatGeckoMobile("19")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>8</td>
  </tr>
  <tr>
   <td><code>Map.keys(), Map.values(), Map.entries()</code></td>
   <td>{{CompatNo}}</td>
   <td>{{ CompatChrome(37) }}<br>
    {{ CompatChrome(38) }}</td>
   <td>{{CompatGeckoMobile("20")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>8</td>
  </tr>
  <tr>
   <td><code>Map.forEach()</code></td>
   <td>{{CompatNo}}</td>
   <td>{{ CompatChrome(36) }}<br>
    {{ CompatChrome(38) }}</td>
   <td>{{CompatGeckoMobile("25")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>8</td>
  </tr>
  <tr>
   <td>Key equality for -0 and 0</td>
   <td>{{CompatNo}}</td>
   <td>{{ CompatChrome(34) }}<br>
    {{ CompatChrome(38) }}</td>
   <td>{{CompatGeckoMobile("29")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
  <tr>
   <td>Constructor argument: <code>new Map(null)</code></td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoMobile("37")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>9</td>
  </tr>
  <tr>
   <td>Monkey-patched <code>set()</code> in Constructor</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoMobile("37")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>9</td>
  </tr>
  <tr>
   <td><code>Map[@@species]</code></td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatGeckoMobile("41")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>10</td>
  </tr>
  <tr>
   <td><code>Map()</code> without <code>new</code> throws</td>
   <td>5.1</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatGeckoMobile("42")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>9</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] Starting with Chrome 31, the feature was available behind a preference. In <code>chrome://flags</code>, activate the entry “Enable Experimental JavaScript”.</p>

<h2 id="Zobacz_też">Zobacz też</h2>

<ul>
 <li><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=697479">Map and Set bug at Mozilla</a></li>
 <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:simple_maps_and_sets">ECMAScript Harmony proposal</a></li>
 <li>{{jsxref("Set")}}</li>
 <li>{{jsxref("WeakMap")}}</li>
 <li>{{jsxref("WeakSet")}}</li>
</ul>