is there a way to read and make joined calculations from a input text?

Question

I am trying to read the value from an input text, and make all the math operations at once

I have gotten to calculate one operation such as 25+67 but I cannot make to read and split more complex operations such as 50+5*5, I do not know how to get the different values and make operations one by one, I have tried creating a loop using split everytime it finds something different than a number but it is not working

Where screen is the id of the input where you can write down all the numbers and operations you like

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="style.css">
    <script src="js/data.js"></script>
    <title>Calculator</title>
</head>
<body>
    <div class="mycalc">
        <form name="calculator" id="calculator" class="cuerpo">
            <h2 class="casio">CASIO</h2>
            <input type="text" name="screen" id="screen" readonly>
            <div>
                <input type="button" id="one" value="1" onclick="takeValue(1)">
                <input type="button" id="two" value="2" onclick="takeValue(2)">
                <input type="button" id="three" value="3" onclick="takeValue(3)">
                <input type="button" id="add" value="+" onclick="takeValue('+')">
            </div>
            <div>
                <input type="button" id="four" value="4" onclick="takeValue(4)">
                <input type="button" id="five" value="5" onclick="takeValue(5)">
                <input type="button" id="six" value="6" onclick="takeValue(6)">
                <input type="button" id="sus" value="-" onclick="takeValue('-')">
            </div>
            <div>
                <input type="button" id="seven" value="7" onclick="takeValue(7)">
                <input type="button" id="eight" value="8" onclick="takeValue(8)">
                <input type="button" id="nine" value="9" onclick="takeValue(9)">
                <input type="button" id="mul" value="*" onclick="takeValue('*')">
            </div>
            <div>
                <input type="button" id="zero" value="0" onclick="takeValue(0)">
                <button type="button" id="clear" value="" onclick="clearInput()">AC</button>
                <input type="button" id="zero" value="="onclick="prueba()">
                <input type="button" id="div" value="/" onclick="takeValue('/')">


            </div>        
        </form> 
        </div>
</body>
</html>

function checkOperation(num1,num2, oper){
    let res;
    switch(oper){
        case "+":   
        res = parseInt(num1) + parseInt(num2);
        break;
        case "-":
        res = parseInt(num) + parseInt(num2);
        break;
        case "*":
        res = parseInt(num1) + parseInt(num2);
        break;
        case "/":
        res = parseInt(num1) + parseInt(num2);  
        break;   
    }
    return res;         
}


function prueba(){   
    let actual = document.getElementById('screen').value;
    let arr = [];
    let res = 0;
    let res1 = 0;
    let temp;
    for(let i = 0; i < actual.length; i++){
        if(isNaN(actual[i])){
            let oper1 = actual[i];
            arr = actual.split(oper1);
            temp = arr[1];
            for(let j = 0; j < temp.length; j++){ 
                 if(isNaN(temp[j])){
                    let oper2 = temp[j];
                    let num1 = temp[0];
                    let num2 =  temp[1];
                    res = checkOperation(num1, num2, oper2)
                }   
            }
            res1 = checkOperation(parseInt(temp), res, oper1)
        }
    }
    document.getElementById('screen').value = res1;
}

https://stackoverflow.com/questions/2276021/evaluating-a-string-as-a-mathematical-expression-in-javascript — Ognjen Marceta, Nov 10 '19 at 11:41
I have gone through the link you posted @OgnjenMarceta but I think my knowdledge does not get to understand it all at the moment,I thought that would be something simpler, I appreciate the comments anyway. Thanks! — jesus fernandez, Nov 10 '19 at 14:58

wentjun · Answer 1 · 2019-11-10T11:42:40.807

0

You can try using JavaScript's eval() function.

const a = eval('25+67');

const b = eval('50+5*5');

console.log(a);
console.log(b);

However, do note that there are various security risks involved when using that function, hence you should be careful when it comes to using it on production code.

edited Nov 10 '19 at 11:42

answered Nov 10 '19 at 11:41

wentjun

40,384
10
95
107

`eval(50+5*5)` does not evaluate anything. It should be `eval("50+5*5")`. – frogatto Nov 10 '19 at 11:42
thanks I am aware of the eval function, the thing is that as I am new to coding I would like to do it myself instead of using the method eval so I can see the logic behind it – jesus fernandez Nov 10 '19 at 11:44
@frogatto how careless am I! I have editted it. Thanks! – wentjun Nov 10 '19 at 11:44
@jesusfernandez ahh I see.. Cool. I don't exactly have a working solution at the top of my head, as I will need to spend some time cracking this problem, but I am guessing the first thing you should focus on should be the operator precedence. – wentjun Nov 10 '19 at 11:46

is there a way to read and make joined calculations from a input text?

1 Answers1