ساخت ماشین حساب با جاوا اسکریپت
ساخت یک ماشین حساب ساده با استفاده از جاوا اسکریپت میتواند پروژهای جالب و آموزشی باشد. در این راهنمای جامع، به بررسی مراحل مختلف ساخت یک ماشین حساب خواهیم پرداخت.
مراحل ساخت ماشین حساب
۱. طراحی رابط کاربری
اولین قدم، طراحی رابط کاربری است. برای این کار، میتوانید از HTML و CSS استفاده کنید. به یک فرم ساده نیاز دارید که شامل دکمهها برای اعداد و عملگرها باشد. مثلاً:
```html
<div id="calculator">
<input type="text" id="display" disabled />
<button onclick="clearDisplay()">C</button>
<button onclick="appendToDisplay('1')">1</button>
<button onclick="appendToDisplay('2')">2</button>
<button onclick="appendToDisplay('+')">+</button>
<button onclick="calculateResult()">=</button>
</div>
```
۲. اضافه کردن استایل با CSS
استفاده از CSS برای زیباتر کردن ماشین حساب الزامی است. با استفاده از ویژگیهای CSS، میتوانید دکمهها و نمایشگر را به شکل دلخواه طراحی کنید.
```css
#calculator {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 10px;
}
button {
padding: 20px;
font-size: 20px;
}
```
۳. نوشتن کد جاوا اسکریپت
حالا نوبت به نوشتن کد جاوا اسکریپت میرسد. این قسمت شامل توابعی است که عملکرد دکمهها را مدیریت میکند.
```javascript
function appendToDisplay(value) {
document.getElementById('display').value += value;
}
function clearDisplay() {
document.getElementById('display').value = '';
}
function calculateResult() {
const display = document.getElementById('display');
try {
display.value = eval(display.value);
} catch (error) {
display.value = 'Error';
}
}
```