1
resposta

[Projeto] Avaliação do aprendizado

Olá! o meu código ficou um pouco diferente do mostrado nas aulas. Isso decorreu de utilizado outras fontes de pesquisa como chat GPT e dicas de amigos que já são DEV para dar uma luz nessa caminhada. visto que a funcionalidade do código se mostrou a mesma, minha duvida é se está tudo bem com o meu aprendizado utilizar estes métodos. procuro sempre buscar a minha independência para solucionar o problema como foco principal, mas fico com a duvida se estou a fazer certo ou se é melhor seguir mais a risca o código do jeito que é escrito nas aulas. Poderiam avaliar o meu código e a minha questão apenas para orientar se estou a utilizar o método correto de aprendizado?

function adicionar() {

let produto = document.getElementById("produto").value; let nomeProduto = produto.split('-')[0]; let valorProduto = produto.split("R$")[1]; let quantidade = document.getElementById("quantidade").value;

let preco= valorProduto * quantidade;

let carrinho = document.getElementById("lista-produtos"); carrinho.innerHTML = carrinho.innerHTML + <section class="carrinho__produtos__produto"> <span class="texto-azul">${quantidade}x</span> ${nomeProduto} <span class="texto-azul">R$ ${preco}</span> </section>

let carrinhoTotal= document.getElementById("valor-total"); let precoAtual= parseFloat(carrinhoTotal.innerText.replace('R$', '').replace(',', '.')) || 0; let precoTotal = precoAtual + preco; carrinhoTotal.innerText = R$ ${precoTotal.toLocaleString('pt-BR', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}; quantidade = document.getElementById("quantidade").value = ''; }

function limpar() { document.getElementById("lista-produtos").innerHTML = ''; document.getElementById("valor-total").innerText = 'R$ 0,00'; }

1 resposta

Olá, Paulo. Tudo bem?

Muito obrigado por compartilhar o seu código aqui com a gente. Parabéns pelo trabalho. Continue com essa dedicação.

Ótimo como você buscou diferentes fontes para aprender, isso é ótimo para desenvolver autonomia. Seu código está funcional e mostra um bom entendimento da manipulação do DOM e do cálculo do total do carrinho.

Um detalhe interessante é que você pode melhorar a organização do seu código ao evitar a repetição de document.getElementById. Uma alternativa é armazenar os elementos em variáveis antes de usá-los. Veja este exemplo:


function adicionar() {
    let produtoInput = document.getElementById("produto");
    let quantidadeInput = document.getElementById("quantidade");
    let carrinho = document.getElementById("lista-produtos");
    let carrinhoTotal = document.getElementById("valor-total");

    let [nomeProduto, valorProduto] = produtoInput.value.split("R$");
    let preco = parseFloat(valorProduto) * parseInt(quantidadeInput.value);

    carrinho.innerHTML += `
    <section class="carrinho__produtos__produto">
        <span class="texto-azul">${quantidadeInput.value}x</span> ${nomeProduto}
        <span class="texto-azul">R$ ${preco.toFixed(2)}</span>
    </section>`;

    let precoAtual = parseFloat(carrinhoTotal.innerText.replace('R$', '').replace(',', '.')) || 0;
    carrinhoTotal.innerText = `R$ ${(precoAtual + preco).toFixed(2)}`;

    quantidadeInput.value = '';
}

Isso facilita a manutenção do código e melhora a legibilidade. Continue assim, com essa dedicação.

Conte com o apoio do Fórum. Abraços e bons estudos.