function menuSet(menuArray) { let flatmenus = menuArray.flat();//Method gom cac Array con va Array cha thanh 1 Array duy nhat let combinedMenu = new Set();//Tao Object trong do Loai bo cac phan tu con trung nhau flatmenus.forEach(dish => { //Dua cac phan tu trong Flatmenus vao Object Set() moi duoc tao combinedMenu.add(dish) }); const menuCombined = document.querySelector('#combined-menu') for (let dish of combinedMenu) { let foodNode = document.createElement('li') foodNode.innerText = dish; menuCombined.appendChild(foodNode); } } menuSet([["Tacos", "Burgers"], ["Pizza"], ["Burgers", "Fries"]])¿Por qué for..in loop no puede tratar con el objeto pero viene bien con Set ()? ¿Set () no devuelve un objeto?
¿Por qué for..in loop no puede tratar con el objeto pero viene bien con Set ()? ¿Set () no devuelve un objeto?
Creo que quisiste decir for...of loop (eso es lo que usa tu código), no for...in .
Para usar for...of en algo, tiene que ser iterable (tiene que implementar la forma estándar de obtener un iterador ). Los objetos no son iterables por defecto. Los objetos Array , Set , Map y String son iterables, y puede crear sus propios objetos iterables, pero los objetos simples no son iterables.
Supongo que está utilizando Set para eliminar duplicados ( "Burgers" aparece dos veces en flatmenus ). No necesita que forEach llame para poner los valores en el Set , puede pasar flatmenus al new Set directamente:
for (let dish of new Set(flatmenus)) { // ... } Eso funciona porque el constructor de Set acepta un objeto iterable y agrega todos los valores de su iterador al Set . Los arreglos son iterables.
Puedes hacer algo como esto:
const menuSet=(menuArray)=> { let flatmenus = new Set(menuArray.flat()); const menuCombined = document.querySelector('#combined-menu') flatmenus.forEach((dish)=>{ let foodNode = document.createElement('li'); foodNode.textContent = dish; menuCombined.appendChild(foodNode); }); } menuSet([["Tacos", "Burgers"], ["Pizza"], ["Burgers", "Fries"]]) <html><head><body><div id="combined-menu"></div></body></head></html>