Cant get state to update with variable

[mjcolyer]

i’ve pasted the handler below. I’m passing the “f” test as evidenced by console.log
beyond that NOTHING changes. I think it has something to do with the way I’m setting the state because even if i change the display state to a simple string… it doesn’t update.

here’s my full code link

      handleOp = (e) => {
        
        //error test
       // console.log('handleOp START/ e= ', e, 'negOn = ', this.state.negOn, 'opOn = ', this.state.opOn, 'e is not a number: ', isNaN(e), 'e != -', e != '-')
        //error test
        
        if(this.state.opOn === true && isNaN(e)){
          
          console.log('this.state.opOn === true && isNaN(e))')
 //when a 2nd opperator is passed in a row but it's not '-'
 //the calculator must use the most recent operator
            //set myfNum to current state.fNum
            myfNum = 'this is working' //this.state.fNum;
            //remove the last element in the fNum string. This is the original operator
            myfNum = myfNum.slice(0, myfNum.length-1);
            //add the new operator to the fNum string
            myfNum = myfNum + e;
            //set sNum to current state.sNum
            mysNum = [...this.state.sNum];
            //remove the last element from the sNum array
            mysNum = mysNum.splice(0, mysNum.length-1);
            //add the new operator being passed to the sNum arry
            mysNum = [...mysNum, e];
            //eq is not on //will not update
            myeqOn = false;
            //opOn remains true
            myopOn = true;
            //a '-' was not the last operator to be passed
            //updates state.display to the new operator 
            myDisplay = e;
            myDotOn = false;
            myNegOn = false;
                    
         this.setState ({
            fNum: myfNum, // myfNum,   //string that stores the top display row 
            sNum: mysNum,   //array that stores numbers and operators which will be used at the equals
            eqOn: myeqOn,   //stops additonal input after equals sign has been pushed
            opOn: myopOn,   //stops eq from firing or additional operators from being added when operator is in display
            display: myDisplay, //string that stores the bottom display row
            dotOn: myDotOn, //insures that the dot can't be pressed twice
            negOn: myNegOn
         })
          
          
        }

[lasjorg]

Not sure we can really help with the code in the current state. When I looked you had commented out variable declarations but were still using them inside the functions. You also seem to have two sets of code some of which look to be meant for testing, but to an outside reader, it just makes the code hard to follow.

I would suggest you fork the project and post a clean version when asking for help.

---

Side note. You should name your variables better.

The only time you should name a function parameter e is if it’s receiving an event object. If you are passing your own arguments to the function, name the parameters accordingly.

Write your code and name your identifiers as if someone else had to read your code, not just you. Be explicit in your naming, do not assume the context of code will make the abbreviations obvious. Adding comments to explain what a variable is used for is a red flag, and it does not mean you get to skip out on coming up with better identifier names.

For Boolean identifiers, I would suggest prefixing the identifiers using something like is or has instead of postfixing it with On. So isEquals instead of eqOn.

Think of code as something a human has to read, not just as something a computer has to run.

[mjcolyer]

Thanks for the direction. . . what is a fork?

[lasjorg]

@mjcolyer

what is a fork?

A fork is just a copy. If you look at the very bottom of your Codepen you will see a fork button you can use it will create a copy of the pen.