Как сделать простой калькулятор своими руками

Создайте базовый калькулятор, использовав HTML и javascript. Начинайте с создания формы для ввода чисел и выбора операции. Используйте простую структуру без лишнего оформления для легкого восприятия.

Основная разметка

Определите элементы для отображения результатов и ввода данных:

1. Поле для ввода числа 1
2. Поле для ввода числа 2
3. Выбор операции
   • Сложение (+)
   • Вычитание (-)
   • Умножение ()
   • Деление ()
4. Кнопка для вычисления результата
5. Область для отображения результата

Пример разметки

<form id="calcForm">
<input type="number" id="num1" placeholder="Первое число">
<input type="number" id="num2" placeholder="Второе число">
<select id="operation">
<option value="add">+
Логика работы с javascript
function calculate() {
const num1 = parseFloat(document.getElementById('num1').value);
const num2 = parseFloat(document.getElementById('num2').value);
const operation = document.getElementById('operation').value;
let result;
if (isNaN(num1) || isNaN(num2)) {
document.getElementById('result').textContent = 'Введите оба числа';
return;
}
switch (operation) {
case 'add':
result = num1 + num2;
break;
case 'subtract':
result = num1 - num2;
break;
case 'multiply':
result = num1 * num2;
break;
case 'divide':
if (num2 === 0) {
document.getElementById('result').textContent = 'Деление на ноль невозможно';
return;
}
result = num1 / num2;
break;
default:
result = 'Ошибка операции';
}
document.getElementById('result').textContent = result;
}

Советы для улучшения

Добавьте обработку ошибок для некорректных данных
Обеспечьте возможность сброса результатов
Расширьте функциональность, добавив поддержку >>=ов, вычислений в степени и количества операций