Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Refatoração] Divisão dos processos em funções

Realizei a divisão dos processos em funções menores para organizar melhor o código da aula. Se tiver algum ponto que seja passível de melhoria, ficaria muito grato de ser informado!

const lista = document.getElementById("lista");
const itemList = [];

function createElement(element) {
  const formulario = document.getElementById("novoItem");

  formulario.addEventListener("submit", (evento) => {
    evento.preventDefault();

    const nome = evento.target.elements["quantidade"];
    const quantidade = evento.target.elements["nome"];

    lista.appendChild(buildItem(nome.value, quantidade.value));
    saveOnLocalStorage(nome.value, quantidade.value);

    nome.value = "";
    quantidade.value = "";
  });
}

function buildItem(quantidade, nome) {
  const item = document.createElement("li");
  item.classList.add("item");
  item.innerHTML = `<strong>${quantidade}</strong>${nome}`;

  return item;
}

function saveOnLocalStorage(nome, quantidade) {
  const actualItem = {
    nome: nome,
    quantidade: quantidade,
  };
  itemList.push(actualItem);
  localStorage.setItem("item", JSON.stringify(itemList));
}

createElement();
1 resposta
solução!

Olá Vitor!

Parabéns pela iniciativa de dividir os processos em funções menores, isso ajuda bastante na organização do código e na legibilidade do mesmo.

Gostei bastante do seu código, não vejo pontos de melhoria por hora, muito bacana essa sua iniciativa de aperfeiçoar o código e obter o resultado esperado, isso mostra a sua veia de programador que além de encontrar caminhos para resolver os problemas se atenta em encontrar caminhos mais curtos e práticos, boa!

Reforço que em caso de qualquer dúvida, me coloco à disposição! Bons estudos!

Sucesso

Um grande abraço e até mais!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!