Set: Colección de Valores Únicos en JavaScript
Aprende a usar Set para almacenar valores únicos sin duplicados, realizar operaciones de conjuntos y optimizar código que requiere verificación de unicidad.
TL;DR - Resumen rápido
- Set almacena solo valores únicos, eliminando automáticamente los duplicados
- Mantiene el orden de inserción de los elementos
- Ofrece métodos como .add(), .has(), .delete() y .clear()
- La propiedad .size devuelve el número de elementos
- Ideal para eliminar duplicados de arrays y operaciones de conjuntos
Introducción a Set
Set es una estructura de datos introducida en ES6 (ECMAScript 2015) que permite almacenar colecciones de valores únicos. A diferencia de los arrays, Set garantiza que no haya valores duplicados, lo que lo hace ideal para escenarios donde necesitas unicidad.
La característica principal de Set es que cada valor puede aparecer solo una vez. Si intentas agregar un valor que ya existe, Set simplemente lo ignora. Esta propiedad lo hace perfecto para eliminar duplicados, verificar unicidad y realizar operaciones de conjuntos matemáticos.
- Valores únicos: no permite duplicados
- Orden de inserción garantizado
- Propiedad <code>size</code> para obtener el número de elementos
- Métodos específicos para manipulación eficiente
- Puede contener cualquier tipo de valor (primitivos, objetos, funciones)
¿Por qué Set y no Array?
Los arrays permiten duplicados y verificar si un valor existe requiere O(n) con indexOf o includes. Set garantiza unicidad y has() es O(1), lo que lo hace mucho más eficiente para operaciones de verificación de existencia.
Crear e Inicializar Set
Puedes crear un Set vacío usando el constructor new Set() o inicializarlo con un iterable como un array. Los duplicados en el iterable se eliminan automáticamente al crear el Set.
Set Vacío
La forma más básica de crear un Set es instanciando el constructor sin argumentos. Esto crea una colección vacía lista para recibir valores mediante el método add().
El constructor Set() crea una nueva instancia vacía. El método add() agrega un valor al Set, devolviendo el propio Set para permitir encadenamiento de métodos.
Set Inicializado con Datos
También puedes inicializar un Set con un iterable como un array. Los valores duplicados en el iterable se eliminan automáticamente, dejando solo valores únicos.
Al inicializar un Set con un array, los duplicados se eliminan automáticamente. Esta es la forma más rápida de eliminar duplicados de un array usando el operador de propagación[...new Set(array)]. Este patrón crea un Set (eliminando duplicados) y luego lo convierte de nuevo a array, siendo una técnica muy común en JavaScript moderno.
Métodos Básicos de Set
Set proporciona una API específica para manipular sus elementos. Estos métodos están diseñados para ser intuitivos y eficientes, permitiendo operaciones comunes como agregar, verificar, eliminar y limpiar elementos.
add() y has()
El método add() agrega un valor al Set, mientras que has() verifica si un valor existe. add() devuelve el propio Set, permitiendo encadenamiento de métodos.
add() devuelve el propio Set, lo que permite encadenar múltiples llamadas. has() devuelve un booleano indicando si el valor existe, con complejidad O(1) en la mayoría de implementaciones.
delete() y clear()
Estos métodos te permiten eliminar elementos específicos o limpiar completamente el Set. delete() devuelve true si eliminó el elemento o false si no existía.
delete() devuelve true si el elemento existía y fue eliminado, o false si no existía. clear() elimina todos los elementos sin valor de retorno. Estos métodos son esenciales para el manejo condicional de datos.
Propiedad size
A diferencia de los arrays donde necesitas calcular la longitud, Set tiene una propiedad size que devuelve directamente el número de elementos. Esta es una operación O(1) muy eficiente.
La propiedad size es un getter que calcula el número actual de elementos en el Set. Es mucho más eficiente que array.length para verificar el tamaño, ya que no requiere recorrer toda la colección.
Ventaja de Performance
La propiedad size es O(1), mientras que array.length también es O(1) pero verificar unicidad con indexOf o includes es O(n). Para operaciones de verificación de existencia, Set ofrece una ventaja de rendimiento significativa.
Iteración sobre Set
Set es iterable por defecto y proporciona múltiples métodos para recorrer sus elementos. Puedes usar for...of, forEach, o los métodos values() y entries() para iterar.
for...of
El bucle for...of es la forma más moderna de iterar sobre un Set. Itera sobre los valores en orden de inserción, proporcionando una sintaxis limpia y legible.
for...of itera directamente sobre los valores del Set en orden de inserción. Esta es la forma más común y legible de iterar sobre un Set cuando necesitas procesar cada elemento individualmente.
forEach()
El método forEach() ejecuta una función para cada elemento del Set. A diferencia de los arrays, forEach() en Set recibe (valor, clave, set) donde clave y valor son iguales.
En Set, forEach() recibe (valor, clave, set) donde valor y clave son el mismo elemento. Esto puede ser confuso si estás acostumbrado a arrays, donde forEach() recibe (elemento, índice, array).
Argumentos en forEach de Set
Cuidado: en Set, forEach((valor, clave, set) => {...}) tiene valor y clave iguales. Esto es diferente de arrays donde forEach((elemento, índice, array) => {...})tiene índice como segundo argumento.
Set vs Array: Cuándo Usar Cada Uno
Tanto Set como Array pueden almacenar colecciones de valores, pero tienen características diferentes que los hacen adecuados para distintos casos de uso. Entender estas diferencias es crucial para escribir código eficiente y mantenible.
Diferencias Clave
Las diferencias fundamentales entre Set y Array afectan el rendimiento, la unicidad de valores y las operaciones disponibles. Set garantiza unicidad, Array permite duplicados.
Este ejemplo muestra las diferencias más importantes: Set elimina duplicados automáticamente, has() es O(1), y no tiene índices. Array permite duplicados, tiene índices, y indexOf es O(n).
- Set: valores únicos, has() es O(1), sin índices
- Array: permite duplicados, indexOf es O(n), tiene índices
- Set: mejor para verificar existencia y eliminar duplicados
- Array: mejor para datos ordenados con acceso por índice
Cuándo Usar Set
Set es la mejor opción cuando necesitas valores únicos, cuando verificas frecuentemente la existencia de elementos, o cuando necesitas eliminar duplicados de una colección.
Este ejemplo muestra cómo usar Set para verificar unicidad de manera eficiente. Con arrays, verificar si un valor existe requiere indexOf o includes que son O(n). Con Set, has() es O(1).
Casos Ideales para Set
Usa Set cuando necesitas: eliminar duplicados de arrays, verificar unicidad frecuentemente, realizar operaciones de conjuntos (unión, intersección, diferencia), o cuando el orden de inserción es importante pero no necesitas índices.
Cuándo Usar Array
Array sigue siendo la mejor opción cuando necesitas acceso por índice, cuando los duplicados son válidos, o cuando necesitas métodos específicos como map, filter, reduce, etc.
Los arrays son ideales para datos ordenados, cuando necesitas acceder por posición, o cuando utilizas métodos de array como map(), filter(), reduce(), etc. También tienen mejor soporte en herramientas de debugging.
Casos de Uso Prácticos
Set brilla en escenarios específicos donde los arrays tradicionales tienen limitaciones. Estos casos de uso demuestran cómo Set puede resolver problemas reales de manera más elegante y eficiente.
Eliminar Duplicados
El caso de uso más común de Set es eliminar duplicados de arrays. El patrón [...new Set(array)] es la forma más concisa y eficiente de lograr esto.
Este ejemplo muestra cómo eliminar duplicados de arrays de diferentes tipos. El patrón [...new Set(array)] funciona para primitivos y objetos (por referencia), eliminando duplicados de manera eficiente.
Operaciones de Conjuntos
Set es perfecto para implementar operaciones matemáticas de conjuntos como unión, intersección y diferencia. Estas operaciones son comunes en análisis de datos y algoritmos.
Este ejemplo muestra cómo implementar unión, intersección y diferencia usando Set. Estas operaciones son mucho más eficientes que con arrays, especialmente para colecciones grandes.
Verificar Unicidad
Set es ideal para verificar si elementos son únicos en una colección. has() es O(1), lo que lo hace mucho más eficiente que indexOf o includes de arrays.
Este ejemplo muestra cómo verificar unicidad de manera eficiente. Con arrays, indexOf es O(n) y puede causar problemas de rendimiento en colecciones grandes. Con Set, has() es O(1), lo que significa que en aplicaciones que verifican unicidad frecuentemente, Set puede ser significativamente más rápido, especialmente con colecciones grandes.
Errores Comunes
Al trabajar con Set, existen ciertos errores comunes que pueden causar bugs difíciles de detectar. Conocer estos errores te ayudará a escribir código más robusto y evitar problemas en producción.
Confusión con Objetos
Un error común es asumir que dos objetos con el mismo contenido son el mismo elemento. En Set, los objetos se comparan por referencia, no por valor, lo que puede causar comportamientos inesperados.
Aunque obj1 y obj2 tienen el mismo contenido, son referencias diferentes, por lo que Set los trata como elementos distintos. Para usar objetos en Set, debes mantener la misma referencia o usar primitivos.
Elementos por Referencia
Set usa igualdad estricta (===) para comparar objetos. Dos objetos con el mismo contenido pero diferentes referencias son elementos distintos. Si necesitas unicidad por valor, considera usar primitivos o implementar tu propia lógica de comparación.
Olvidar el Encadenamiento
El método add() devuelve el propio Set, lo que permite encadenar múltiples llamadas. No aprovechar esta característica resulta en código más verboso y menos legible.
El encadenamiento de métodos hace el código más conciso y legible. Aprovecha esta característica de add() para inicializar Sets de manera más elegante, especialmente cuando tienes múltiples elementos que agregar.
Iteración Incorrecta
Otro error común es confundir los argumentos de forEach() en Set. A diferencia de arrays, forEach() en Set tiene valor y clave iguales, lo que puede causar confusión.
En Set, forEach() recibe (valor, clave, set) donde valor y clave son el mismo elemento. Esto es diferente de arrays donde forEach() recibe (elemento, índice, array). Confundir esto puede causar lógica incorrecta.
Resumen: Set en JavaScript
Conceptos principales:
- •Set almacena solo valores únicos, eliminando automáticamente los duplicados
- •Mantiene el orden de inserción de los elementos en todas las iteraciones
- •La propiedad size devuelve el número de elementos en O(1)
- •Métodos principales: add(), has(), delete(), clear()
- •Es iterable por defecto con for...of y proporciona forEach()
Mejores prácticas:
- •Usa Set para eliminar duplicados de arrays con [...new Set(array)]
- •Aprovecha el encadenamiento de métodos con add() para código más limpio
- •Prefiere Set sobre Array para verificar unicidad frecuentemente
- •Usa Array cuando necesites acceso por índice o métodos específicos
- •Recuerda que los objetos se comparan por referencia, no por valor