Ok so basically, I’m making a calculator which is not yet finished and I am encountering some problems. So I made a % option and so after clicking on that button, the code for taking the second number which will be (x/100 * y) y in that formula doesn’t work. So, according to the code here:
if (operator === "%" && number1 != null) { takeNumber2 = true }
the takeNumber2 should be true which it is (according to the console) but upon taking a value for number2, the code doesn’t work as it should because of
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) { number2 = 0; } else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) { number2 = number2 * 10 + 0; }
now in theory because of this code, if number2 has a value of null, it just takes the value as the button has been pressed (in this case 0) which works, but it also says that if number2 does have a value which isn’t null then number2 should be number2 * 10 + the button pressed (in this case: 0), however, this does not work ONLY for this percent function. It works for all other functions. Any ideas/suggestions on how to fix this?
Here’s my code:
index.html:
`
<!DOCTYPE html>
<html>
<head>
<title> Calculator (Scientific + Geometrical) </title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<script src="./index.js"> </script>
<h1> Calculator (Scientific + Geometrical) </h1>
<br>
<button type="button" onclick="key0();" class="button"> 0 </button>
<button type="button" onclick="key1();" class="button"> 1 </button>
<button type="button" onclick="key2();" class="button"> 2 </button>
<button type="button" onclick="key3();" class="button"> 3 </button>
<button type="button" onclick="key4();" class="button"> 4 </button>
<button type="button" onclick="key5();" class="button"> 5 </button>
<button type="button" onclick="key6();" class="button"> 6 </button>
<button type="button" onclick="key7();" class="button"> 7 </button>
<button type="button" onclick="key8();" class="button"> 8 </button>
<button type="button" onclick="key9();" class="button"> 9 </button>
<br> <br>
<button type="button" onclick="add();" class="button"> + </button>
<button type="button" onclick="subtract();" class="button"> - </button>
<button type="button" onclick="multiply();" class="button"> * </button>
<button type="button" onclick="divide();" class="button"> / </button>
<button type="button" onclick="equals();" class="button"> = </button>
<br> <br>
<button type="button" onclick="pi();" class="button"> π </button>
<button type="button" onclick="root();" class="button"> √ </button>
<button type="button" onclick="power();" class="button"> ^ </button>
<button type="button" onclick="percent();" class="button"> % </button>
<br> <br>
<button type="button" onclick="location.reload();" class="button"> AC </button>
</div>
</body>
</html>
`
style.css
`
body {
background-color: black;
}
h1 {
color: white;
text-align: center;
}
.button {
font-size: 150%;
width: 5%;
}
.button:hover {
color: red;
font-size: 175%;
width: 7.5%;
}
`
index.js:
`
let number1 = null;
let number2 = null;
let operator = null;
let result = null;
let takeNumber2 = false;
function key0() {
if (number1 === null && operator === null) {
number1 = 0;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 0;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 0;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 0;
}
}
function key1() {
if (number1 === null && operator === null) {
number1 = 1;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 1;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 1;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 1;
}
}
function key2() {
if (number1 === null && operator === null) {
number1 = 2;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 2;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 2;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 2;
}
}
function key3() {
if (number1 === null && operator === null) {
number1 = 3;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 3;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 3;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 3;
}
}
function key4() {
if (number1 === null && operator === null) {
number1 = 4;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 4;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 4;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 4;
}
}
function key5() {
if (number1 === null && operator === null) {
number1 = 5;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 5;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 5;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 5;
}
}
function key6() {
if (number1 === null && operator === null) {
number1 = 6;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 6;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 6;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 6;
}
}
function key7() {
if (number1 === null && operator === null) {
number1 = 7;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 7;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 7;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 7;
}
}
function key8() {
if (number1 === null && operator === null) {
number1 = 8;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 8;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 8;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 8;
}
}
function key9() {
if (number1 === null && operator === null) {
number1 = 9;
} else if (number1 !== null && operator === null) {
number1 = number1 * 10 + 9;
}
if (number1 !== null && operator !== null && number2 === null || takeNumber2 === true) {
number2 = 9;
} else if (number2 !== null && number1 !== null && operator !== null || takeNumber2 === true) {
number2 = number2 * 10 + 9;
}
}
function add() {
if (operator === null && number1 !== null) {
operator = "+";
}
}
function subtract() {
if (operator === null && number1 !== null) {
operator = "-";
}
}
function multiply() {
if (operator === null && number1 !== null) {
operator = "*";
}
}
function divide() {
if (operator === null && number1 !== null) {
operator = "/";
}
}
function equals() {
if (number1 !== null && number2 !== null && operator !== null) {
if (operator === "+") {
result = number1 + number2;
alert("The answer is " + result);
number1 = null;
number2 = null;
operator = null;
}
if (operator === "-") {
result = number1 - number2;
alert("The answer is " + result);
number1 = null;
number2 = null;
operator = null;
}
if (operator === "*") {
result = number1 * number2;
alert("The answer is " + result);
number1 = null;
number2 = null;
operator = null;
}
if (operator === "/") {
result = number1 / number2;
alert("The answer is " + result)
number1 = null;
number2 = null;
operator = null;
}
if (operator === "root") {
result = Math.pow(number1, 1/number2);
alert("The answer is " + result);
number1 = null;
number2 = null;
operator = null;
}
if (operator === "power") {
result = Math.pow(number1, number2);
alert("The answer is " + result);
number1 = null;
number2 = null;
operator = null;
}
if (operator === "%") {
result = number1 / 100 * number2;
alert("The answer is " + result);
number1 = null;
number2 = null;
operator = null;
}
}
}
function pi() {
if (number1 === null) {
number1 = Math.PI;
}
if (number1 !== null && operator !== null && number2 === null) {
number2 = Math.PI;
}
}
function root() {
operator = "root";
if (operator === "root" && number1 !== null) {
takeNumber2 = true;
}
}
function power() {
operator = "power";
if (operator === "power" && number1 !== null) {
takeNumber2 = true;
}
}
function percent() {
operator = "%";
if (operator === "%" && number1 != null) {
takeNumber2 = true;
}
}
setInterval(function() {
console.log("Number 1: " + number1);
console.log("Number 2: " + number2);
console.log("Operator: " + operator);
console.log("Take Number 2: " + takeNumber2);
}, 10000)
`