---
title: Colecciones con clave
slug: Web/JavaScript/Guide/Keyed_collections
tags:
  - Colecciones
  - Conjunto
  - Guía
  - JavaScript
  - Map
  - 'l10n:priority'
  - set
translation_of: Web/JavaScript/Guide/Keyed_collections
---
<div>{{jsSidebar("JavaScript Guide", "Guía de JavaScript")}} {{PreviousNext("Web/JavaScript/Guide/Indexed_Collections", "Web/JavaScript/Guide/Working_with_Objects")}}</div>

<p class="summary">Este capítulo presenta colecciones de datos que están indexadas por una clave; los objetos <code>Map</code> y <code>Set</code> contienen elementos que son iterables en el orden de inserción.</p>

<h2 id="Mapas">Mapas</h2>

<h3 id="Objeto_map">Objeto <code>map</code></h3>

<p>ECMAScript 2015 introduce una nueva estructura de datos para asociar claves con valores. Un objeto {{JSxRef("Map")}} es un mapa de clave/valor simple y puedes iterar sobre sus elementos en el orden en que fueron insertados.</p>

<p>El siguiente código muestra algunas operaciones básicas con un <code>Map</code>. Consulta también la página de referencia de {{JSxRef("Map")}} para obtener más ejemplos y la API completa. Puedes usar un bucle {{JSxRef("Sentencias/for...of", "for...of")}} para devolver un arreglo de <code>[<var>key</var>, <var>value</var>]</code> para cada iteración.</p>

<pre class="brush: js notranslate">let sayings = new Map();
sayings.set('dog', 'woof');
sayings.set('cat', 'meow');
sayings.set('elephant', 'toot');
sayings.size; // 3
sayings.get('dog'); // woof
sayings.get('fox'); // undefined
sayings.has('bird'); // false
sayings.delete('dog');
sayings.has('dog'); // false

for (let [key, value] of sayings) {
  console.log(key + ' goes ' + value);
}
// "cat goes meow"
// "elephant goes toot"

sayings.clear();
sayings.size; // 0
</pre>

<h3 id="Comparar_Object_y_map">Comparar <code>Object</code> y <code>map</code></h3>

<p>Tradicionalmente, los {{JSxRef("Object", "objetos", "", 1)}} se han utilizado para asignar cadenas a valores. Los objetos te permiten establecer claves a valores, recuperar esos valores, eliminar claves y detectar si algo está almacenado en una clave. Los objetos <code>Map</code>, sin embargo, tienen algunas ventajas más que los hacen mejores mapas.</p>

<ul>
 <li>Las claves de un <code>Object</code> son {{JSxRef("Global_Objects/String", "Cadenas")}} o {{JSxRef("Global_Objects/Symbol", "Símbolos")}}, donde pueden tener cualquier valor para un <code>Map</code>.</li>
 <li>Puedes obtener el <code>size</code> de un <code>Map</code> fácilmente, mientras que tienes que realizar un seguimiento manual del tamaño de un <code>Object</code>.</li>
 <li>La iteración de mapas está en el orden de inserción de los elementos.</li>
 <li>Un <code>Object</code> tiene un prototipo, por lo que hay claves predeterminadas en el mapa. (Esto se puede omitir usando <code>map = Object.create(null)</code>).</li>
</ul>

<p>Estos tres consejos te pueden ayudar a decidir si usar un <code>Map</code> o un <code>Object</code>:</p>

<ul>
 <li>Usa mapas sobre objetos cuando las claves sean desconocidas hasta el momento de la ejecución, y cuando todas las claves sean del mismo tipo y todos los valores sean del mismo tipo.</li>
 <li>Utiliza mapas si es necesario almacenar valores primitivos como claves porque el objeto trata cada clave como una cadena, ya sea un valor numérico, un valor booleano o cualquier otro valor primitivo.</li>
 <li>Usa objetos cuando haya lógica que opere en elementos individuales.</li>
</ul>

<h3 id="El_objeto_WeakMap">El objeto <code>WeakMap</code></h3>

<p>El objeto {{JSxRef("WeakMap")}} es una colección de pares clave/valor en la que las <strong>claves solo son objetos</strong> y los valores pueden ser valores arbitrarios. Las referencias de objeto en las claves se mantienen <em>débilmente</em>, lo que significa que son un objetivo de recolección de basura (GC por <em>Garbage Collection</em>) si ya no hay otra referencia al objeto. La API de <code>WeakMap</code> es la misma que la API de <code>Map</code>.</p>

<p>Una diferencia con los objetos <code>Map</code> es que las claves en <code>WeakMap</code> no son enumerables (es decir, no hay ningún método que te proporcione una lista de las claves). Si lo hubiera, la lista dependería del estado de la recolección de basura, introduciendo el no determinismo.</p>

<p>Para obtener más información y código de ejemplo, consulta también "¿Por qué mapa <em>Débil</em>?" en la página de referencia de {{JSxRef("WeakMap")}}.</p>

<p>Un caso de uso de los objetos <code>WeakMap</code> es almacenar datos privados para un objeto u ocultar detalles de implementación. El siguiente ejemplo es de la publicación del blog de Nick Fitzgerald <a href="http://fitzgeraldnick.com/weblog/53/">"Ocultar detalles de implementación con WeakMaps de ECMAScript 6"</a>. Los datos y métodos privados pertenecen al objeto y se almacenan en <code><var>privates</var></code> del objeto <code>WeakMap</code>. Todo lo expuesto en la instancia y el prototipo es público; todo lo demás es inaccesible desde el mundo exterior porque <code><var>privates</var></code> no se exporta desde el módulo.</p>

<pre class="brush: js notranslate">const privates = new WeakMap();

function Public() {
  const me = {
    // Los datos privados van aquí
  };
  privates.set(this, me);
}

Public.prototype.method = function () {
  const me = privates.get(this);
  // Hacer cosas con datos privados en `me`...
};

module.exports = Public;</pre>

<h2 id="Sets"><code>Sets</code></h2>

<h3 id="El_objeto_Set">El objeto <code>Set</code></h3>

<p>Los objetos {{JSxRef("Set")}} son colecciones de valores. Puedes iterar sus elementos en el orden en que se insertaron. Un valor en un <code>Set</code> solo puede aparecer una vez; es único en la colección del <code>Set</code>.</p>

<p>El siguiente código muestra algunas operaciones básicas con un <code>Set</code>. Además, consulta la página de referencia de {{JSxRef("Set")}} para obtener más ejemplos y la API completa.</p>

<pre class="brush: js notranslate">let mySet = new Set();
mySet.add(1);
mySet.add('algún texto');
mySet.add('foo');

mySet.has(1); // true
mySet.delete('foo');
mySet.size; // 2

for (let item of mySet) console.log(item);
// 1
// "algún texto"
</pre>

<h3 id="Conversión_entre_arreglo_y_Set">Conversión entre arreglo y <code>Set</code></h3>

<p>Puedes crear un {{JSxRef("Array")}} a partir de un <code>Set</code> usando {{JSxRef("Array.from")}} o el {{JSxRef("Operators/Spread_operator", "operador de propagación")}}. Además, el constructor <code>Set</code> acepta un <code>Array</code> para convertirlo en la otra dirección.</p>

<div class="blockIndicator note">
<p><strong>Nota</strong>: Recuerda que los objetos <code>Set</code> almacenan <em>valores únicos</em>, por lo que cualquier elemento duplicado de un arreglo se elimina al realizar la conversión.</p>
</div>

<pre class="brush: js notranslate">Array.from(mySet);
[...mySet2];

mySet2 = new Set([1, 2, 3, 4]);
</pre>

<h3 id="Comparar_Array_y_Set">Comparar <code>Array</code> y <code>Set</code></h3>

<p>Tradicionalmente en muchas situaciones, un conjunto de elementos se ha almacenado en arreglos de JavaScript. Sin embargo, el nuevo objeto <code>Set</code> tiene algunas ventajas:</p>

<ul>
 <li>Eliminar elementos <code>Array</code> por valor (<code>arr.splice(arr.indexOf(val), 1)</code>) es muy lento.</li>
 <li>Los objetos <code>Set</code> te permiten eliminar elementos por su valor. Con un arreglo, tendrías que empalmar (con <code>splice</code>) en función del índice de un elemento.</li>
 <li>El valor {{JSxRef("NaN")}} no se puede encontrar con <code>indexOf</code> en un arreglo.</li>
 <li>Los objetos <code>Set</code> almacenan valores únicos. No es necesario que realices un seguimiento manual de los duplicados.</li>
</ul>

<h3 id="El_objeto_WeakSet">El objeto <code>WeakSet</code></h3>

<p>Los objetos {{JSxRef("WeakSet")}} son colecciones de objetos. Un objeto en el <code>WeakSet</code> solo puede aparecer una vez. Es único en la colección <code>WeakSet</code> y los objetos no son enumerables.</p>

<p>Las principales diferencias con el objeto {{JSxRef("Set")}} son:</p>

<ul>
 <li>A diferencia de los <code>Sets</code>, los <code>WeakSets</code> son <strong>colecciones <em>únicamente</em> de <em>objetos</em></strong> y no de valores arbitrarios de cualquier tipo.</li>
 <li>El <code>WeakSet</code> es <em>débil</em>: Las referencias a los objetos de la colección se mantienen débiles. Si no hay otra referencia a un objeto almacenado en el <code>WeakSet</code>, pueden ser recolectados como basura. Eso también significa que no hay una lista de objetos actualmente almacenados en la colección. Los <code>WeakSets</code> no se pueden enumerar.</li>
</ul>

<p>Los casos de uso de los objetos <code>WeakSet</code> son limitados. No perderán memoria, por lo que puede ser seguro usar elementos DOM como clave y marcarlos con fines de seguimiento, por ejemplo.</p>

<h2 id="Igualdad_de_clave_y_valor_de_Map_y_Set">Igualdad de clave y valor de <code>Map</code> y <code>Set</code></h2>

<p>Tanto la igualdad de claves de los objetos <code>Map</code> como la igualdad de valores de los objetos <code>Set</code> se basan en "<a href="https://tc39.github.io/ecma262/#sec-samevaluezero">algoritmo del mismo valor cero</a>":</p>

<ul>
 <li>La igualdad funciona como el operador de comparación de identidad <code>===</code>.</li>
 <li><code>-0</code> y <code>+0</code> se consideran iguales.</li>
 <li>{{JSxRef("NaN")}} se considera igual a sí mismo (al contrario de <code>===</code>).</li>
</ul>

<p>{{PreviousNext("Web/JavaScript/Guide/Indexed_Collections", "Web/JavaScript/Guide/Working_with_Objects")}}</p>