En cada ejecución de mi código, a availableGoodsUrlSet se le puede asignar un nuevo valor, que es de tipo Set (por simplicidad, lo asigno a un objeto de fecha en el siguiente código), a partir de la segunda ejecución quiero obtener la diferencia del nuevo availableGoodsUrlSet con su valor anterior, pero cuando hice clic en el enlace Add a list item por segunda vez en el siguiente código para probar, obtuve
Uncaught TypeError: lastAvailableGoodsUrlSet.has is not a function at options.html:37 at Array.filter (<anonymous>) at MutationObserver.<anonymous> (options.html:37)Entonces, ¿cómo lograr mi objetivo?
Ejemplo simple de MutationObserver .invisible { opacidad: 0; } <body> <h1>Simple MutationObserver Example</h1> <response class="invisible response">Success!</response> <ul> <li>Pre-existing list item</li> <li>Pre-existing list item</li> </ul> <p><a data-click="add-list-item" href="#">Add a list item</a></p> <script> var unorderedList = document.getElementsByTagName("ul")[0]; if (unorderedList) { var lastAvailableGoodsUrlSet = new Set(); var observer = new MutationObserver( function (mutations) { availableGoodsUrlSet = new Set(); date = new Date(); availableGoodsUrlSet.add(date); // lastAvailableGoodsUrlSet.add(date); difference =new Set([...availableGoodsUrlSet].filter(x => !lastAvailableGoodsUrlSet.has(x))); console.log("difference--------", difference); lastAvailableGoodsUrlSet=Object.assign({}, availableGoodsUrlSet); }); // pass in the target node and the observer config options observer.observe(unorderedList, { childList: true, subtree: true }); // listen for any clicks on the add-list-item link document.querySelector('[data-click="add-list-item"]').onclick = function (event) { var newLi = document.createElement("li"); newLi.innerText = "New list item"; unorderedList.appendChild(newLi); event.preventDefault(); }; } </script> </body>No use lastAvailableGoodsUrlSet=Object.assign({}, availableGoodsUrlSet); Está cambiando Establecer objeto a objeto puro que no tiene método add .
En caso de que necesite fusionar conjuntos, puede hacer esto:
const firstList = new Set([1,2,3]); const secondList = new Set([3,4,5]); const result = [...new Set([...firstList, ...secondList])]; console.log(result);Para obtener la diferencia:
const firstList = [1, 2, 3]; const secondList = [3, 4, 5]; const result = firstList.filter(x=> !secondList.includes(x)); console.log(result);