Por Que Usar Set?

É uma estrutura de dados que permite armazenar valores únicos de qualquer tipo. É semelhante a um array, mas não permite valores duplicados. É uma ótima maneira de manter valores únicos de qualquer tipo. Às vezes, você deseja armazenar valores exclusivos em um array, mas não deseja percorrer o array para verificar se o valor já existe. É aí que o Set se torna útil.

Em um artigo anterior, discutimos Javascript Map. O Set é semelhante ao Map, mas ele armazena apenas as chaves, não os valores. É uma ótima maneira de manter valores exclusivos de qualquer tipo. É opressivo usar Map em muitos casos. É por isso que vamos falar sobre Set.

O Que é JavaScript Set?

Os objetos Set são coleções de valores. Um valor no Set pode ocorrer apenas uma vez; é único na coleção do Set. Você pode iterar pelos elementos de um conjunto na ordem de inserção. A ordem de inserção corresponde à ordem em que cada peça foi inserida no Set pelo método add() com sucesso (ou seja, não havia um elemento idêntico já no Set quando o Set chamou add()).

A especificação exige que os conjuntos sejam implementados "que, em média, fornecem tempos de acesso que são sublineares no número de elementos na coleção." Portanto, ele pode ser representado internamente como uma tabela de hash (com pesquisa O(1)), uma árvore de pesquisa (com pesquisa O(log(N))) ou qualquer outra estrutura de dados, desde que a complexidade seja melhor que O(N).

Como Criar um Set?

Existem duas maneiras de criar um Set. A primeira maneira é usar o construtor Set. A segunda maneira é usar o literal de objeto Set.

Construtor Set

O construtor Set cria um novo objeto Set. Você pode passar um objeto iterável como argumento para o construtor. Os elementos do objeto iterável serão adicionados ao novo Set.

const set = new Set([1, 2, 3, 4, 5])

Literal de Objeto Set

O literal de objeto Set cria um novo objeto Set. Você pode passar um objeto iterável como argumento para o literal de objeto. Os elementos do objeto iterável serão adicionados ao novo Set.

const set = {1, 2, 3, 4, 5};

Métodos & Propriedade do Set

Método	Descrição
add()	Adiciona um novo elemento com um valor especificado ao objeto Set.
clear()	Remove todos os elementos do objeto Set.
delete()	Remove o elemento associado ao valor e retorna o valor que Set.prototype.has(value) teria retornado anteriormente. Set.prototype.has(value) retornará false posteriormente.
entries()	Retorna um novo objeto Iterator que contém um array de [value, value] para cada elemento no objeto Set, na ordem de inserção.
forEach()	Executa uma função fornecida uma vez para cada valor no objeto Set, na ordem de inserção.
has()	Retorna um booleano afirmando se um elemento está presente com o valor fornecido no objeto Set.
keys()	Retorna um novo objeto Iterator que contém os valores para cada elemento no objeto Set na ordem de inserção.
values()	Retorna um novo objeto Iterator que contém os valores para cada elemento no objeto Set na ordem de inserção.

Propriedade	Descrição
size	Retorna o número de valores no objeto Set.

Exemplos de Set

Adicionar um Valor ao Set

const set = new Set([1, 2, 3, 4, 5])
set.add(6)
console.log(Set) // Set { 1, 2, 3, 4, 5, 6 }

Deletar um Valor do Set

const set = new Set([1, 2, 3, 4, 5])
set.delete(3)
console.log(set) // Set { 1, 2, 4, 5 }

Verificar se um Valor Existe no Set

const set = new Set([1, 2, 3, 4, 5])
console.log(set.has(3)) // true

Iterar pelo Set

const set = new Set([1, 2, 3, 4, 5])
for (const item of Set) {
  console.log(item)
}
// 1
// 2
// 3
// 4
// 5

Converter Set para Array

const set = new Set([1, 2, 3, 4, 5])
const array = Array.from(set)
console.log(array) // [1, 2, 3, 4, 5]

Converter Array para Set

const Array = [1, 2, 3, 4, 5]
const set = new Set(array)
console.log(Set) // Set { 1, 2, 3, 4, 5 }

Obter o Tamanho do Set

const set = new Set([1, 2, 3, 4, 5])
console.log(set.size) // 5

Limpar Set

const set = new Set([1, 2, 3, 4, 5])
set.clear()
console.log(set) // Set {}

Mesclar Set

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([6, 7, 8, 9, 10])
const set3 = new Set([...set1, ...set2])
console.log(set3) // Set { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 }

Obter a Interseção de Dois Sets

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([4, 5, 6, 7, 8])
const set3 = new Set([...set1].filter((x) => set2.has(x)))
console.log(set3) // Set { 4, 5 }

Obter a Diferença Entre Dois Sets

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([4, 5, 6, 7, 8])
const set3 = new Set([...set1].filter((x) => !set2.has(x)))
console.log(set3) // Set { 1, 2, 3 }

Verificar se Set é um Subconjunto de Outro Set

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([4, 5])
console.log([...set2].every((x) => set1.has(x))) // true

Verificar se Set é um Superconjunto de Outro Set

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([4, 5])
console.log([...set1].every((x) => set2.has(x))) // false

Verificar se Dois Sets são Disjuntos

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([6, 7, 8, 9, 10])
console.log([...set1].every((x) => !set2.has(x))) // true

Verificar se Dois Sets são Iguais

const set1 = new Set([1, 2, 3, 4, 5])
const set2 = new Set([1, 2, 3, 4, 5])
console.log(set1.size === set2.size && [...set1].every((x) => set2.has(x))) // true

Suporte do Navegador

Chrome	Firefox	Edge	Safari	Opera
49+	44+	12+	10.1+	36+

Set vs. Array

Set	Array
Valor único, não permite valor duplicado	Permite valor duplicado
Set é uma coleção de valores sem ordem específica	Array é uma coleção de valores em uma ordem específica
Set é iterável	Array é iterável
Set é mais lento que um array na inicialização porque usa um processo de hash.	Array é mais rápido em termos de inicialização
Desempenho é melhor ao verificar a existência de um elemento	Desempenho é melhor ao acessar um elemento

Este artigo foi originalmente publicado em blog.imam.dev.

Conjuntos JavaScript: fundamentos para desenvolvedores iniciantes