Saltar al contenido principal
12Sets y Maps

Set

Un Set es una colección de valores en la que cada valor solo puede aparecer una vez. Es perfecto cuando quieres asegurarte de que no hay duplicados.

Crear un Set

Creamos un Set con la palabra reservada new. Podemos partir de uno vacío o darle un iterable (como un array) con los valores iniciales:

const vacio = new Set()
const colores = new Set(['rojo', 'verde', 'azul'])

console.log(colores) // Set(3) { 'rojo', 'verde', 'azul' }

Si le pasas un array con valores repetidos, el Set se queda solo con los únicos:

const numeros = new Set([1, 1, 2, 3, 3, 3])
console.log(numeros) // Set(3) { 1, 2, 3 }

Métodos y propiedades

.add()

Añade un valor al Set. Si el valor ya existe, no hace nada:

const frutas = new Set()
frutas.add('manzana')
frutas.add('pera')
frutas.add('manzana') // se ignora

console.log(frutas) // Set(2) { 'manzana', 'pera' }

Como .add() devuelve el propio Set, puedes encadenar llamadas:

const frutas = new Set()
frutas.add('manzana').add('pera').add('plátano')

console.log(frutas) // Set(3) { 'manzana', 'pera', 'plátano' }

.has()

Comprueba si un valor está en el Set. Devuelve un boolean:

const frutas = new Set(['manzana', 'pera'])

console.log(frutas.has('manzana')) // true
console.log(frutas.has('kiwi')) // false
Nota

.has() es una de las grandes ventajas del Set: comprobar si un valor existe es mucho más rápido que recorrer un array con .includes() cuando hay muchos elementos.

.delete()

Elimina un valor. Devuelve true si existía y false si no:

const frutas = new Set(['manzana', 'pera'])

console.log(frutas.delete('pera')) // true
console.log(frutas.delete('kiwi')) // false
console.log(frutas) // Set(1) { 'manzana' }

.size

Nos dice cuántos elementos tiene (es el equivalente a .length de los arrays):

const frutas = new Set(['manzana', 'pera'])
console.log(frutas.size) // 2

.clear()

Vacía el Set por completo:

const frutas = new Set(['manzana', 'pera'])
frutas.clear()
console.log(frutas.size) // 0
Infografía
Un Set por dentro: add, has y delete
6.delete('pera') la elimina y devuelve true porque existía. Queda solo la manzana.
Paso 6 de 6

Iterar un Set

Un Set es iterable, así que puedes recorrerlo con for...of:

const colores = new Set(['rojo', 'verde', 'azul'])

for (const color of colores) {
  console.log(color)
}
// rojo
// verde
// azul

También tienes el método .forEach():

const colores = new Set(['rojo', 'verde'])
colores.forEach((color) => console.log(color))

El truco estrella: eliminar duplicados de un array

Como un Set elimina los duplicados y podemos convertirlo de nuevo en array con el spread operator (...), tenemos la forma más limpia de quitar repetidos:

const conRepetidos = [1, 2, 2, 3, 4, 4, 4, 5]

const sinRepetidos = [...new Set(conRepetidos)]

console.log(sinRepetidos) // [1, 2, 3, 4, 5]
Infografía
El truco: quitar duplicados con un Set
4.Con el spread, [...set], lo convertimos de nuevo en un array: [1, 2, 3, 4, 5].
Paso 4 de 4
Nota

Ojo: el Set compara los valores con el mismo criterio que ===. Por eso elimina primitivos duplicados, pero no considera iguales dos objetos distintos aunque tengan las mismas propiedades.