duvida sobre posição do código

Oi, Luiz, como vai?

A função que você mencionou é responsável por criar uma nova tarefa e adicionar a interação com o usuário. O if...else dentro dessa função está verificando se a tarefa já está completa ou não.

A estrutura if...else é usada para tomar decisões baseadas em condições. No caso do código que você compartilhou, a condição é tarefa.completa. Se essa condição for verdadeira, ou seja, se a tarefa estiver completa (tarefa.completa for true), o código dentro do bloco if será executado. Nesse caso, a tarefa será marcada como completa e o botão será desabilitado.

Por outro lado, se a tarefa não estiver completa (tarefa.completa for false), o código dentro do bloco else será executado. Nesse caso, o código adiciona uma função ao evento onclick do elemento li, permitindo que o usuário interaja com a tarefa.

A função de criar tarefa é chamada quando o usuário clica no botão de submit, mas a verificação de tarefa.completa ocorre cada vez que uma tarefa é criada. Isso é importante para garantir que a tarefa seja exibida corretamente, independentemente de estar completa ou não.

Espero ter ajudado. Caso tenha dúvidas, conte com o fórum. Abraços!

Ahhhh entendi, só tenho mais duvida sobre tarefaselecionada e tarefa, percebi que as duas variáveis tinham meio que o "mesmo" valor. nesse trecho de código, faz a verificação:

    if (tarefa.completa){
    li.classList.add('app__section-task-list-item-complete')
    botao.setAttribute('disabled', 'disabled')
    } 

mas aqui é atribuido tarefa a tarefa selecionada:

 if (tarefaSelecionada == tarefa) {
    paragrafoDescricaoTarefa.textContent = ''
    tarefaSelecionada = null
    litarefaSelecionada = null
    return
    }
    tarefaSelecionada = tarefa
    litarefaSelecionada = li
    paragrafoDescricaoTarefa.textContent = tarefa.descricao
    
    li.classList.add('app__section-task-list-item-active')

poderia explicar melhor como essas duas variáveis "guardam" o mesmo valor?

Oi, Luiz, tudo bem?

Desculpa a demora em te responder!

As variáveis tarefaSelecionada e tarefa estão relacionadas e podem ter o mesmo valor em determinados momentos, contudo, cada sua importância no controle das tarefas selecionadas e completas. A variável tarefa é utilizada para representar a tarefa que está sendo iterada no momento, enquanto a variável tarefaSelecionada é utilizada para representar a tarefa que foi selecionada pelo usuário.

Quando o código verifica se tarefaSelecionada é igual a tarefa, ele está verificando se a tarefa que foi clicada é a mesma que já estava selecionada. Se for a mesma tarefa, a descrição é removida e as variáveis tarefaSelecionada e liTarefaSelecionada são resetadas (ficando com estado null). Caso não seja a mesma tarefa, a tarefa selecionada é atualizada com a tarefa clicada, a variável liTarefaSelecionada é atualizada com o item de lista clicado e a descrição da tarefa é atualizada com a descrição da tarefa clicada.

Espero ter ajudado. Caso tenha dúvidas, conte com o fórum. Abraços!