3
respostas

[Dúvida] tarefas.forEach

Olá, eu não entendi a necessidade dessa função:

tarefas.forEach(task => {
    const taskItem = createTask(task); 
    tasklistcontainer.appendChild(taskItem); 
});

Não estaríamos fazendo a mesma coisa nessa parte do código?

formTask.addEventListener('submit', (evento)=>{ 
    evento.preventDefault();
    const task = {
        descricao: textArea.value,
        concluida: false
    }
    tarefas.push(task);
    const taskItem = createTask(task); 
    tasklistcontainer.appendChild(taskItem); 
})
3 respostas

Olá, Maitê! Entendo que a similaridade dos códigos possa causar confusão, mas eles têm propósitos diferentes.

O primeiro bloco de código que você mencionou:

tarefas.forEach(task => {
    const taskItem = createTask(task); 
    tasklistcontainer.appendChild(taskItem); 
});

Este código é usado para iterar sobre o array tarefas e para cada tarefa (task) no array, ele cria um item de tarefa (taskItem) usando a função createTask(task). Em seguida, ele adiciona esse item de tarefa ao container de lista de tarefas (tasklistcontainer) usando appendChild(taskItem). Isso é útil para quando você tem várias tarefas no array tarefas e deseja exibir todas elas na interface do usuário.

Por outro lado, o segundo bloco de código que você mencionou:

formTask.addEventListener('submit', (evento)=>{ 
    evento.preventDefault();
    const task = {
        descricao: textArea.value,
        concluida: false
    }
    tarefas.push(task);
    const taskItem = createTask(task); 
    tasklistcontainer.appendChild(taskItem); 
})

Este código é um manipulador de eventos que é acionado quando o formulário é enviado. Ele cria uma nova tarefa com a descrição da tarefa sendo o valor atual do textArea e um status de concluida como false. Em seguida, ele adiciona essa nova tarefa ao array tarefas usando tarefas.push(task). Após isso, ele cria um item de tarefa para a nova tarefa e adiciona ao container de lista de tarefas.

Portanto, embora os dois blocos de código pareçam semelhantes, eles têm propósitos diferentes. O primeiro é usado para exibir todas as tarefas existentes no array tarefas, enquanto o segundo é usado para adicionar uma nova tarefa ao array tarefas e exibir essa nova tarefa na interface do usuário.

Espero ter ajudado e bons estudos!

Ainda não entendi a necessidade da função tarefas.forEach, pois já estaríamos criando um item de tarefa para a nova tarefa e adicionando ao container de lista de tarefas na função formTask.addEventListener.

Muito obg pelo retorno!

Maitê, até concordava contigo, mas analisando melhor e testando o código, entendo que o forEach nesse caso será necessário para recuperar a Lista guardada no local storage e apresentar na tela, visto que o formTask só é executado quando solicitado, apresentando apenas novas informações enviadas à lista.