// Function to ask for the operation function getOperation() { const operation = prompt("Choose an operation: +, -, *, /"); return operation; } // Function to ask for numbers function getNumbers() { const num1 = parseFloat(prompt("Enter first number:")); const num2 = parseFloat(prompt("Enter second number:")); return { num1, num2 }; } // Perform the calculation based on the operation function calculate(operation, num1, num2) { switch (operation) { case '+': return num1 + num2; case '-': return num1 - num2; case '*': return num1 * num2; case '/': // Check for division by zero if (num2 === 0) { return "Cannot divide by zero"; } return num1 / num2; default: return "Invalid operation"; } } // Main function to run the calculator function runCalculator() { const operation = getOperation(); const { num1, num2 } = getNumbers(); const result = calculate(operation, num1, num2); alert(`Result: ${result}`); } // Run the calculator runCalculator();function calculate(number1,number2,operator){ if (!number1 || !number2){ return "Invalid number" } if (!['*','-','/','+'].includes(operator)){ return "Invalid operator" } switch(operator){ case "+": return number1 + number2; case "/": return number1 * number2; case "*": return number1 * number2; case "-": return number1 - number2; } } console.log(calculate(5,6,"+"))<!-- Create a simple Program to build the Calculator in JavaScript using with HTML and CSS web languages. --> <!DOCTYPE html> <html lang = "en"> <head> <title> JavaScript Calculator </title> <style> h1 { text-align: center; padding: 23px; background-color: skyblue; color: white; } #clear{ width: 270px; border: 3px solid gray; border-radius: 3px; padding: 20px; background-color: red; } .formstyle { width: 300px; height: 530px; margin: auto; border: 3px solid skyblue; border-radius: 5px; padding: 20px; } input { width: 20px; background-color: green; color: white; border: 3px solid gray; border-radius: 5px; padding: 26px; margin: 5px; font-size: 15px; } #calc{ width: 250px; border: 5px solid black; border-radius: 3px; padding: 20px; margin: auto; } </style> </head> <body> <h1> Calculator Program in JavaScript </h1> <div class= "formstyle"> <form name = "form1"> <!-- This input box shows the button pressed by the user in calculator. --> <input id = "calc" type ="text" name = "answer"> <br> <br> <!-- Display the calculator button on the screen. --> <!-- onclick() function display the number prsses by the user. --> <input type = "button" value = "1" onclick = "form1.answer.value += '1' "> <input type = "button" value = "2" onclick = "form1.answer.value += '2' "> <input type = "button" value = "3" onclick = "form1.answer.value += '3' "> <input type = "button" value = "+" onclick = "form1.answer.value += '+' "> <br> <br> <input type = "button" value = "4" onclick = "form1.answer.value += '4' "> <input type = "button" value = "5" onclick = "form1.answer.value += '5' "> <input type = "button" value = "6" onclick = "form1.answer.value += '6' "> <input type = "button" value = "-" onclick = "form1.answer.value += '-' "> <br> <br> <input type = "button" value = "7" onclick = "form1.answer.value += '7' "> <input type = "button" value = "8" onclick = "form1.answer.value += '8' "> <input type = "button" value = "9" onclick = "form1.answer.value += '9' "> <input type = "button" value = "*" onclick = "form1.answer.value += '*' "> <br> <br> <input type = "button" value = "/" onclick = "form1.answer.value += '/' "> <input type = "button" value = "0" onclick = "form1.answer.value += '0' "> <input type = "button" value = "." onclick = "form1.answer.value += '.' "> <!-- When we click on the '=' button, the onclick() shows the sum results on the calculator screen. --> <input type = "button" value = "=" onclick = "form1.answer.value = eval(form1.answer.value) "> <br> <!-- Display the Cancel button and erase all data entered by the user. --> <input type = "button" value = "Clear All" onclick = "form1.answer.value = ' ' " id= "clear" > <br> </form> </div> </body> </html> <!-- Create a simple Program to build the Calculator in JavaScript using with HTML and CSS web languages. --> <!DOCTYPE html> <html lang = "en"> <head> <title> JavaScript Calculator </title> <style> h1 { text-align: center; padding: 23px; background-color: skyblue; color: white; } #clear{ width: 270px; border: 3px solid gray; border-radius: 3px; padding: 20px; background-color: red; } .formstyle { width: 300px; height: 530px; margin: auto; border: 3px solid skyblue; border-radius: 5px; padding: 20px; } input { width: 20px; background-color: green; color: white; border: 3px solid gray; border-radius: 5px; padding: 26px; margin: 5px; font-size: 15px; } #calc{ width: 250px; border: 5px solid black; border-radius: 3px; padding: 20px; margin: auto; } </style> </head> <body> <h1> Calculator Program in JavaScript </h1> <div class= "formstyle"> <form name = "form1"> <!-- This input box shows the button pressed by the user in calculator. --> <input id = "calc" type ="text" name = "answer"> <br> <br> <!-- Display the calculator button on the screen. --> <!-- onclick() function display the number prsses by the user. --> <input type = "button" value = "1" onclick = "form1.answer.value += '1' "> <input type = "button" value = "2" onclick = "form1.answer.value += '2' "> <input type = "button" value = "3" onclick = "form1.answer.value += '3' "> <input type = "button" value = "+" onclick = "form1.answer.value += '+' "> <br> <br> <input type = "button" value = "4" onclick = "form1.answer.value += '4' "> <input type = "button" value = "5" onclick = "form1.answer.value += '5' "> <input type = "button" value = "6" onclick = "form1.answer.value += '6' "> <input type = "button" value = "-" onclick = "form1.answer.value += '-' "> <br> <br> <input type = "button" value = "7" onclick = "form1.answer.value += '7' "> <input type = "button" value = "8" onclick = "form1.answer.value += '8' "> <input type = "button" value = "9" onclick = "form1.answer.value += '9' "> <input type = "button" value = "*" onclick = "form1.answer.value += '*' "> <br> <br> <input type = "button" value = "/" onclick = "form1.answer.value += '/' "> <input type = "button" value = "0" onclick = "form1.answer.value += '0' "> <input type = "button" value = "." onclick = "form1.answer.value += '.' "> <!-- When we click on the '=' button, the onclick() shows the sum results on the calculator screen. --> <input type = "button" value = "=" onclick = "form1.answer.value = eval(form1.answer.value) "> <br> <!-- Display the Cancel button and erase all data entered by the user. --> <input type = "button" value = "Clear All" onclick = "form1.answer.value = ' ' " id= "clear" > <br> </form> </div> </body> </html> 5-6= java script calculatorconst keys = document.querySelector('.calculator-keys'); keys.addEventListener('click', (event) => { // Access the clicked element const { target } = event; // Check if the clicked element is a button. // If not, exit from the function if (!target.matches('button')) { return; } if (target.classList.contains('operator')) { console.log('operator', target.value); return; } if (target.classList.contains('decimal')) { console.log('decimal', target.value); return; } if (target.classList.contains('all-clear')) { console.log('clear', target.value); return; } console.log('digit', target.value); });