AD

¿Ya dominas lo básico? Un curso estructurado de JavaScript es la vía rápida para dar el salto.

Ver cursos de JavaScript en Udemy

Enlace de afiliado. No te cuesta nada extra.

🟨Lecciones de JavaScript
Lección 28 / 69

Usar Set (colecciones)

En esta lección usarás el Set de JavaScript (una colección) para gestionar datos sin duplicados y comprobar la pertenencia con rapidez. Está dirigida a quien busca «uso de Set en JavaScript» o «eliminar duplicados de un array en JavaScript».

Un Set es una «caja sin duplicados» que no puede contener dos veces el mismo valor. Resulta cómodo para quitar duplicados de un array o comprobar rápidamente si un valor está incluido. Hay además una ventaja de rendimiento: Set.has() es más rápido que el .includes() de un array cuando hay muchos datos. Es un mecanismo que te deja manejar directamente en el programa la idea matemática de «conjunto».

El código de ejemplo construye uniqueNums, sin duplicados, a partir de un array nums que los contiene, usando new Set(nums); después lo convierte de nuevo en array con la sintaxis de propagación [...uniqueNums] y lo muestra. También existe un método como .has(2) para comprobar si un valor concreto está incluido. Queda más corto y legible que escribir la comprobación de duplicados con un for.

Un tropiezo habitual al empezar es que, a diferencia de un array, a un Set no se accede por índice. Algo como uniqueNums[0] no funciona: para sacar valores tienes que convertirlo en array o recorrerlo con for...of. Según la situación, irás alternando entre arrays y Sets.

En el desarrollo real, Set se usa ampliamente en situaciones que necesitan gestionar duplicados o comprobar existencia rápido: quitar etiquetas repetidas seleccionadas en un formulario, o registrar los identificadores de páginas visitadas para detectar repeticiones.

Además de lo mostrado, Set tiene métodos como .delete(valor) para eliminar un valor concreto y la propiedad .size para saber el número de elementos, la contraparte del .length de los arrays.

JavaScript
SALIDA

💡 Todo lo que pases a console.log() aparece en la salida de abajo.

Espacio publicitario (banner)
Espacio publicitario (en el artículo)