Raf, editei o post. Subi o código para o codepen!
Obrigado pela dica!
Opa, talvez eu me expressei mal. Pode deixar o javascript no tabnews apenas formate legal com o markdown para ficar facil de ler :D no codepen ficou excellente mas tem gente que prefere ler no tabnews.
O seu codigo esta bem bacana, bem melhor do que muita coisa que jah vi, parabens. Tem alguns pontos que pode melhorar principalmente na repeticao. Por exemplo:
Este treixo:
const idsNumeros = {
num0: document.querySelector("#num0"),
num1: document.querySelector("#num1"),
num2: document.querySelector("#num2"),
num3: document.querySelector("#num3"),
num4: document.querySelector("#num4"),
num5: document.querySelector("#num5"),
num6: document.querySelector("#num6"),
num7: document.querySelector("#num7"),
num8: document.querySelector("#num8"),
num9: document.querySelector("#num9")
}
const adicionarNumeros = {
num0: function() {numeros.numeroVisor += "0"; formatar();},
num1: function() {numeros.numeroVisor += "1"; formatar();},
num2: function() {numeros.numeroVisor += "2"; formatar();},
num3: function() {numeros.numeroVisor += "3"; formatar();},
num4: function() {numeros.numeroVisor += "4"; formatar();},
num5: function() {numeros.numeroVisor += "5"; formatar();},
num6: function() {numeros.numeroVisor += "6"; formatar();},
num7: function() {numeros.numeroVisor += "7"; formatar();},
num8: function() {numeros.numeroVisor += "8"; formatar();},
num9: function() {numeros.numeroVisor += "9"; formatar();}
};
const imprimirNumeros = {
num0: idsNumeros.num0.addEventListener('click', adicionarNumeros.num0),
num1: idsNumeros.num1.addEventListener('click', adicionarNumeros.num1),
num2: idsNumeros.num2.addEventListener('click', adicionarNumeros.num2),
num3: idsNumeros.num3.addEventListener('click', adicionarNumeros.num3),
num4: idsNumeros.num4.addEventListener('click', adicionarNumeros.num4),
num5: idsNumeros.num5.addEventListener('click', adicionarNumeros.num5),
num6: idsNumeros.num6.addEventListener('click', adicionarNumeros.num6),
num7: idsNumeros.num7.addEventListener('click', adicionarNumeros.num7),
num8: idsNumeros.num8.addEventListener('click', adicionarNumeros.num8),
num9: idsNumeros.num9.addEventListener('click', adicionarNumeros.num9)
}
Pode ser substituido por algo assim:
/*
idsNumeros, adicionarNumeros e imprimirNumeros
Podem ser simplificados como abaixo.
*/
for (let i=0; i<10; i++) {
const formatarVisor = () => {
numeros.numeroVisor += i;
formatar();
}
// Adicionar click evento nos elementos de numero
document.querySelector(`#num${i}`).addEventListener('click', formatarVisor)
}
Tem outras melhorias mas elas vao deixar o codigo totalmente diferente. Tem como melhorar a abstracao, eu percebi que voce agrupou elementos semelhantes em consts
por exemplo salvarOperacao
mais ao inves de agrupar elementos semelhantes seria legal se usarmos abstracoes. Normalmente aprendemos melhores abstracoes com experiencia por isso eu nao quiz mudar muito. Se eu tiver um tempinho hoje eu tento re-escrever o codigo para voce dar uma olhada.
Contudo, no genral esta muito bom.
Olá, Raf!
Esse método de simplificação que você me apresentou é incrível, nem havia cogitado nessa possibilidade.
Muito obrigado por retirar um período do seu tempo para olhar o meu código, apontar meus erros e transmitir um pouco do seu conhecimento!
Opa Guilherme,
Escrevi um pouco de codigo para mostrar como seria algo que voce provavelmente vai ver em producao: https://codepen.io/rafasantos-the-bashful/pen/JjBXQoK
Esta incompleto e voce pode continuar se quiser. Este tipo de codigo nao eh necessariamente mais simples. Contudo tem a vantagem de ser melhor de manter e esta mais alinhado com os principios SOLID https://medium.com/desenvolvendo-com-paixao/o-que-%C3%A9-solid-o-guia-completo-para-voc%C3%AA-entender-os-5-princ%C3%ADpios-da-poo-2b937b3fc530
Naquele codigo, preste atencao no visor
, processador
e acoes
essas sao abstracoes e normalmente codificamos com abstracoes. Infelizmente, eh algo que adiquire com tempo e nao eh muito facil de explicar, voce pega com o tempo e praticando.
Bom, tenta implementar a subtracao
voce vai ver que sera moleza.
abrs
Muito obrigado por me ajudar, Raf!
Vou começar a treinar a codar usando abstrações!
Feliz ano novo! Que 2023 seja um ano incrível para nós!