Как предотвратить попадание всего массива в цикл вызова класса, нужен только его последний элемент?

У меня реализован функционал через класс Task. Этот класс вызывает цикл, вследствие чего каждый элемент массива попадает в отдельную карточку. Карточки создает пользователь при нажиме на кнопку формы, в которые попадает введенный ним текст. Данные введенные пользователем, попадают в массив, на основании чего цикл выводит карточки. При нажиме первый раз - карточка формируется одна, как и задумывалось. Когда пользователь нажимает второй раз - выводится вторая карточка и дублируется первая. Но мне надо, чтобы карточки выводились без дубляжа. Что мне нужно подправить в этом участке кода? Только при перезагрузке страницы дубляж исчезает

let tasks = [];

function createTaskList(tasks) {


    // Динамический вывод задач. Их количество зависит от количество элементов массива tasks
    tasks.forEach((task, index) => {
      new Task(
        task
      ).render();
      
    });

    // Превращение JS массива в строчный и добавление его в localStorage
    localStorage.setItem('allTodo', JSON.stringify(tasks));

  } //end function createTaskList
  createTaskList(tasks);