0
respostas

Ajuda com um projeto de calculadora

Bom dia pessoal tudo bem?

gente eu to com um problema e não to conseguindo achar uma saida, gostaria de pedir uma ajuda.

O problema é o seguinte, eu fiz uma calculadora por javascript, porem eu estou com duvidas de como acionar uma condição, eu queria que quando eu coloca-se o sinal de vezes ou divisão ela resolvesse primeiro essa operação e depois as outras, por exemplo (2 + 5 X 3 = 17), no meu caso, está dando 21 o resultado.

segue os códigos do js.

Javascript

const display1E1 = document.querySelector('.display-1');
const display2E1 = document.querySelector('.display-2');
const tempResultE1 = document.querySelector('.temp-result');
const numerosE1 = document.querySelectorAll('.numero');
const operacoesE1 = document.querySelectorAll('.operacao');
const igualE1 = document.querySelector('.igual');
const limpaTudoE1 = document.querySelector('.all-clear');
const limpaUltimoE1 = document.querySelector('.last-clear');

let dis1Numero = '';
let dis2Numero = '';
let resultado = null;
let ultimaOperacao = '';
let temPonto = false;

numerosE1.forEach( numero => {
    numero.addEventListener('click', (evento) =>{
        if (evento.target.innerText === '.' && !temPonto){
            temPonto = true;
        }else if (evento.target.innerText === '.' && temPonto){
            return;
        }
        dis2Numero += evento.target.innerText;
        display2E1.innerText = dis2Numero;
    })
});

operacoesE1.forEach( operacao => {
    operacao.addEventListener('click', (evento) =>{
        if (!dis2Numero) resultado;
        temPonto = false;
        const operacaoNome = evento.target.innerText;
        if(dis1Numero && dis2Numero && ultimaOperacao){
            mathOperacao();            
        }else{
            resultado = parseFloat(dis2Numero);
        }
        limpaVariavel(operacaoNome);
        ultimaOperacao = operacaoNome;
        console.log(resultado);
    })
});

function limpaVariavel(nome = ''){
    dis1Numero += dis2Numero+ ' ' + nome + ' ';
    display1E1.innerText = dis1Numero;
    display2E1.innerText = '';
    dis2Numero = '';
    tempResultE1.innerText = resultado;
}

function mathOperacao(){
    if(ultimaOperacao === '+'){
        resultado = parseFloat(resultado) + parseFloat(dis2Numero);
    } else if (ultimaOperacao === '-'){
        resultado = parseFloat(resultado) - parseFloat(dis2Numero);
    } else  if (ultimaOperacao === '%') {
        resultado = parseFloat(resultado) % parseFloat(dis2Numero);
    } else if(ultimaOperacao === 'X'){
        resultado = parseFloat(resultado) * parseFloat(dis2Numero);
    }else if (ultimaOperacao === '/') {
        resultado = parseFloat(resultado) / parseFloat(dis2Numero);
    }
}

igualE1.addEventListener('click', (evento) => {
    if(!dis1Numero || !dis2Numero) return;
    temPonto = false;
    mathOperacao();
    limpaVariavel();
    display2E1.innerText = resultado;
    tempResultE1.innerText = '';
    dis2Numero = resultado;
    dis1Numero = '';
});

limpaTudoE1.addEventListener('click' , (evento) =>{
    display1E1.innerText = '0';
    display2E1.innerText = '0';
    dis1Numero = '';
    dis2Numero = '';
    resultado = '';
    tempResultE1.innerText = '0';
});

limpaUltimoE1.addEventListener('click', (evento) => {
    display2E1.innerText = '';
    dis2Numero = '';
});

window.addEventListener('keydown', (evento) =>{
    if(
        evento.key === '0' ||
        evento.key === '1' ||
        evento.key === '2' ||
        evento.key === '3' ||
        evento.key === '4' ||
        evento.key === '5' ||
        evento.key === '6' ||
        evento.key === '7' ||
        evento.key === '8' ||
        evento.key === '9' ||
        evento.key === '.' 
    ){
        clicaBotaoE1(evento.key);
    } else if (
        evento.key === '+' ||
        evento.key === '-' ||
        evento.key === '/' ||
        evento.key === '%' 
    ){
        clicaOperacao(evento.key);
    } else if( evento.key === '*'){
        clicaOperacao('X');
    } else if (evento.key === 'Enter' || evento.key === '='){
        clicaIgual();
    }
});

function clicaBotaoE1(key){
    numerosE1.forEach( button => {
        if (button.innerText === key){
            button.click();
        }
    });
}

function clicaOperacao (key){
    operacoesE1.forEach( button => {
        if (button.innerText === key){
            button.click();
        }
    })
}

function clicaIgual () {
    igualE1.click();
}