Как итерировать массив и вывести только уникальные значения?

Question

[reinmaker90]

Как в данном примере пройти по массиву и выводить только новые значения, т.е. те, которые еще не были добавлены в dom?

Comments

[PetrPo]

а зачем тебе цикл?
так надо?

UPD ссылку обновил

[reinmaker90]

PetrPo, затупил, а все же вопрос для меня актуальный если таким образом рушить числа в массив или же произвольный через импут, то как потом вывести только уникальные ключи, без задвоения

[PetrPo]

reinmaker90, в смысле сделать массив с уникальными значениями? надо точнее понять задачу, опиши реальность а не абстракцию

UPD в ответах хороший вариант с set предложил человек.

[reinmaker90]

PetrPo, видел, а пример такой есть массив например от 1 до 10, он рендерится куда то в дом, не важно, к этому массив у скажем каждую минуту добавляется +1,как сделать цикл что бы он при последующих его вызова отдавал для рендера только новое значение, а не все елементы что хранятся в массиве на момент итерации, буду за пк напишу в фидле, может я бред несу конечно)

[PetrPo]

reinmaker90, объяви переменную что-то типа lastIndex, когда рендеришь записывай индекс последнего отрендеренного элемента в эту переменную, а в следующий раз начинай рендер с этого индекса.

Почему спрашивал про реальную задачу - ты говоришь о каких-то простых числах, но если отойти от примитивов и рассмотреть задачу на объектах, то твои возможности значительно расширяются, и вместо там глобальной (образно говоря) переменной lastIndex, ты можешь добавлять в объект что-то, например render: true

let arr = [
    {value: 1, render: false},
    {value: 2, render: false},
    {value: 3, render: false},
];

arr.map(a => {
    if(!a.render) {
        console.log(a.value);
        a.render = true;
    }
});

Answer 1

[LJ322]

Создайте коллекцию Set для хранения уникальных значений и записывайте туда элементы после добавления в DOM

const btn = document.querySelector("button");
 const div = document.createElement("div");
 div.classList.add("y");
 document.querySelector(".x").appendChild(div);
 let count = 0;
 let set = new Set();
 btn.addEventListener("click", () => {
   count += 1;
   !set.has(count) ? div.insertAdjacentHTML(
     "beforeend",
     `<button class="btn" value="${count}">${count}</button>`
   ) : set.add(count);
 });

P.S. Немного с опозданием, но думаю вам пригодится на будущее: Set позволяет хранить только уникальные значения

Comments

[reinmaker90]

Спасибо!