Saludos Christopher, podrías por favor, explicar como el operador de propagacion y Set eliminan los números repetidos? Gracias de antemano!
Se realiza la conversión de Array a Set. Set es una estructura que no admite elementos repetidos. Por lo tanto, tenemos un Set con los elementos del array sin repetidos.
Como tenemos una estructura Set, debemos convertirlo a Array.
El operador de propagación, como su nombre lo indica, propaga los elementos de un iterable en otro iterable. Los Sets son iterables como los Arrays, por lo que sus elementos pueden propagarse dentro de un iterable array [... new Set(array)]. Lo que se asemeja a propagar los elementos de un array dentro de otro array.
const array =[1,1,2,2,3,4,4,5]// 1. Convertir de Array a Setconst set =newSet(array)// Set(5) {1, 2, 3, 4, 5}// 2. Convertir de Set a Arrayconst arraySinRep =Array.from(set)// [1, 2, 3, 4, 5]// 3. Propagar los elementos del Array dentro de otro Arrayconst sinRepetidos =[...arraySinRep]// [1, 2, 3, 4, 5]
¡Nunca pares de aprender! 🙌
Set es parecido al array, pero una de las diferencias con el array es que impide agregar elementos repetidos
Oh sí eso es algo súper útil!! buena observación, igual cabe destacar que esto no funciona by default para los Array de objetos a menos que los tengas guardados con un Key especifico
O sino también puedes usar Symbols Irving.
Metodos utiles de Set:
add
has
delete
size
const set =newSet();set.add('item 1');// Set ['item 1']set.add('item 2').add('item 3');// Set ['item 1','item 2','item 3']set.has('item 2');// trueset.delete('item 1');// Set ['item 2','item 3', 1] set.size();// 2
gracias, buen aporte
Buen aporte! gracias!
Hola Chic@s :)
set-add
const list =newSet();list.add("item 1");list.add("item 2").add("item 3");console.log(list);
Alguna aplicación en el mundo real? Como un lugar concreto donde sea usada esta función, como ser insertado en el botón de bñusqueda de KAYAK, por poner un ejemplo. Aprendería más rápido si viera más ejemplos aplicados del mundo real...
Hola, Soeluc.
Puedes buscar ejercicios en javascript que hagan algún objetivo en específico, como: buscar un usuario dentro de un objeto y eliminarno o agregar uno nuevo y/o hacer que el array que te pase el usuario retorne los valores sin estar duplicados.
Eso depende también del contexto en como lo apliques.
Codesignal es una página con ejercicios que te piden en el mundo laborar o entrevistas de trabajo.
Saludos.
Algo que siento es importante saber y destacar acerca de Map/Set es que es básicamente una implementación de la estructura de datos hash-map ya que se basa en guardar nuestros datos como Key-Value.
Gracias bro! Yo también uso esa página para resolver dudas.
SET - Un Set es una colección de elementos sin un orden en particular, en donde cada elemento puede aparecer una sola vez. Es una estructura muy similar a los arrays, pero con la particularidad de que cada elemento que posee es único.
En JS los sets ya están implementados mediante la clase Set, por lo tanto, si queremos crear un nuevo set debemos instanciarlo utilizando la palabra reservada new Set()
var array =[1,1,1,2,3,4,4,5,5,3]var set1 =newSet(array)console.log(array)// [ 1,1,1,2,3,4,4,5,5,3 ]console.log(set1)// Set { 1, 2, 3, 4, 5 }
ES6: Set-add
En ECMAScript 6, se introdujo una nueva característica llamada "Set". Un "Set" es una estructura de datos que te permite almacenar un conjunto de valores únicos, lo que significa que no puede haber duplicados en un "Set". La operación "add" en un "Set" se utiliza para agregar elementos nuevos.
Imagina que tienes una colección de elementos y quieres asegurarte de que no haya duplicados. Un "Set" es perfecto para esta situación. Cuando usas el método "add", puedes insertar un nuevo elemento en el "Set". Sin embargo, si ese elemento ya existe en el "Set", no se agregaría de nuevo. Esto es útil para mantener una lista de elementos únicos.
Aquí hay un ejemplo simple de cómo podrías usar "Set" y el método "add" en JavaScript ES6:
// Crear un nuevo Setconst miSet =newSet();// Agregar elementos usando el método addmiSet.add(10);miSet.add(20);miSet.add(10);// No se agregará porque ya existe// Tamaño del Set después de agregar elementosconsole.log(miSet.size);// Esto mostrará 2, ya que solo hay dos elementos únicos// También puedes agregar elementos en una sola líneamiSet.add(30).add(40);// Iterar a través de los elementos del Set usando un ciclo for...offor(const elemento of miSet){console.log(elemento);}
En este ejemplo, el "Set" llamado miSet contiene los elementos 10, 20, 30 y 40. Sin embargo, como notarás, el valor 10 solo se agregó una vez, a pesar de que se intentó agregar dos veces. Esto demuestra cómo el método "add" en un "Set" garantiza que los elementos sean únicos.
Ejemplos utilizando Set()
Aquí tienes algunos ejemplos adicionales de cómo puedes usar la estructura de datos Set en JavaScript ES6:
Ejemplo 1: Eliminando elementos de un Set
Puedes usar el método delete para eliminar elementos de un Set.
const numeros =newSet([1,2,3,4,5]);console.log(numeros.size);// Muestra 5numeros.delete(3);// Elimina el elemento 3 del Setconsole.log(numeros.size);// Ahora muestra 4
Ejemplo 2: Verificando la existencia de un elemento en un Set
Puedes usar el método has para verificar si un elemento existe en un Set.
Ejemplo 3: Convirtiendo un Array en un Set y viceversa
Puedes convertir fácilmente entre un Array y un Set utilizando los constructores y métodos respectivos.
Ejemplo 4: Trabajando con Objetos en un Set
Los Set también pueden almacenar objetos.
const personas =newSet();const persona1 ={nombre:'Juan',edad:30};const persona2 ={nombre:'María',edad:25};personas.add(persona1);personas.add(persona2);console.log(personas.size);// Muestra 2// Puedes iterar y acceder a los objetos dentro del Setfor(const persona of personas){console.log(persona.nombre, persona.edad);}
Estos son solo algunos ejemplos de cómo puedes utilizar la estructura de datos Set en JavaScript ES6 para almacenar y manipular conjuntos únicos de valores.
Esta estructura me resulta interesante! 🤔
Espero sea de utilidad la información. 👨💻
Seria más productivo si, se viera ejemplos prácticos. Eso ayudaria muchísimo.
📇 Archivos del Proyecto 📇
Pasos 📌
• Dentro de la carpeta es6, crear el archivo llamado: 10-set-add.js
◦ El código queda:
//Compilar: seleccionar el código + click derecho + Run Code//Ejercicio #1const list =newSet();list.add('item 1');list.add('item 2').add('item 3');console.log(list);/*output:
Set(3) { 'item 1', 'item 2', 'item 3' }
*/
El método add( ) inserta un nuevo elemento con un valor específico en un objeto seleccionado, si este valor ya exisite en el objeto, éste nuevo elemento no se inserta.
Hola comunidad! probé guardar en una variable lo que hicimos con list.add y luego a esa variable agregarle el add y funciona.
También hiciste que "los objetos tuvieran nombre" no se si así se le denomina.
Para quien hizo el curso de Programacion basica en JavaScritp recordara el juego Mokepon, en el cual, el rival aleatoriamente elegia 5 ataques, los cuales no debian repetirse, en su momento este asunto no se resolvio.
En su momento lo resolvi, usando ciclos for y condicionales, pero esta herramienta de SET, hubiera sido muy util en esa situacion. mi tarea será re-escribir mi logica implementando esta herramienta.
Las razones para usar ES6 son muchas, en primer lugar la optimización de los distintos navegadores hace que ES6 sea increíblemente rápido, un requisito fundamental para una página web. ES6 también admite la gestión de clases y la introducción de funciones de flecha simplifica muchos aspectos de la programación. La adición de plantillas en cadenas simplifica la lectura del código y con ES6 es posible resolver los mismos problemas que se resolvieron con CoffeeScript pero de mejor manera. CoffeeScript es un lenguaje de programación creado con la intención de resolver problemas anteriores de Javascript.
La lista podría ser aún más larga, pero el mensaje principal es este: ES6 no solo ha sido capaz de corregir los errores del pasado sino que ha conseguido dar nuevas herramientas y simplificar la vida de los desarrolladores, y por ello incluso hoy, años después , se toma como punto de referencia.
✨🦄 Una cosa que se debe recalcar
sobre Set, es que si bien este permite el control sobre elementos repetidos, no se puede acceder a los elementos mediante una posición numérica.
Por ejemplo, si en un array normal queremos acceder al primer elemento, simplemente lo podemos hacer con:
let array =[1,2,3,4]array[0]// 1
Pero en un Set esto no es posible. En su lugar podríamos recorrer el Set con un ciclo for of:
//Set y addconst list =newSet();list.add('Item 1');list.add('Item 2');//Set no permite agregar elementos repetidoslist.add('Item 2');let i =0;for(let element of list){if(i ==0){console.log(`[${i}] = ${element}`); i++;}}
O en su lugar, transformar el Set a array para posteriormente acceder al elemento deseado por un index numérico.
const arrayFromSet =[...list];console.log(arrayFromSet[0]);// Accede al primer elemento
// ¿Qué es un conjunto? // Un conjunto es una colección de valores únicos. Se puede crear un conjunto a partir de una matriz utilizando el operador de propagación (...). También se puede crear un conjunto utilizando la nueva palabra clave. // Ejemplo de creación de un conjunto a partir de un array utilizando el operador de dispersión (...) // lista constante = [1, 2, 3, 4, 5]; // const set = new Set([...lista]); // ¿Cuál es la diferencia entre un conjunto y un array? // Un conjunto es similar a una matriz pero no permite valores duplicados. Un conjunto es una colección desordenada de valores únicos. Un conjunto se puede iterar en el orden de inserción de los elementos.const list =newSet();list.add(1);list.add(2);// list.add(2).add(3).add(4).add(5);list.add(3);list.add(4);list.add(5);console.log(list);// Set { 1, 2, 3, 4, 5 }console.log(list.has(1));// trueconsole.log(list.has(6));// false
Muy flojo el profesor explicando esta parte, literalmente no dijo nada que aporte valor.
El Método .add() en Sets
El método .add() es la herramienta fundamental para insertar valores únicos en un Set. Su comportamiento es directo: si el valor es nuevo, lo integra; si ya existe, lo ignora silenciosamente, manteniendo la integridad de tu colección.
Puntos clave
Encadenamiento: Al retornar el objeto Set tras cada operación, permite encadenar múltiples .add() en una sola línea de código.
Unicidad garantizada: Elimina la necesidad de validaciones manuales, asegurando que cada elemento sea único por definición.
Por lo que veo en la consola las listas que se crean con Set son un tipo de objeto, con valores sin atributos, osea más parecido a un array... ¿Qué son y para qué sirven las listas?
En JavaScript, un Set es un objeto que representa una colección de valores únicos. Al igual que los arrays, los Sets te permiten almacenar múltiples valores en una sola estructura de datos, pero a diferencia de los arrays, los Sets no permiten valores repetidos y no tienen un orden específico.
Los Sets son útiles cuando necesitas almacenar un conjunto de valores únicos y hacer operaciones como verificar si un valor está presente en la colección o agregar y eliminar valores de la misma. Además, los Sets pueden ser utilizados para eliminar duplicados de un array y para hacer operaciones de conjunto como la unión, intersección y diferencia.
Que ventajas tiene usar set por sobre arrays???
Segun me he informado aqui mismo en la seccion de comentarios de esta clase, te sirve cuando quieres tener un array que no tenga valores duplicados, considerando que el set es un objeto que tiene una coleccion con estos valores
