Task 27: Build a Simple Calculator with Functions
Start with Affirmation
- "I am destined for greatness. Every step I take brings me closer to my goals. I embrace challenges, knowing they are stepping stones to success. My mind is focused, my heart is determined, and my actions are aligned with my dreams."
Daily Affirmations for Success
- ✅ I am capable, confident, and unstoppable.
- ✅ Success flows to me because I take consistent action.
- ✅ I attract opportunities that align with my purpose.
- ✅ My hard work and persistence create abundance.
- ✅ I am always learning, growing, and evolving.
- ✅ I believe in my potential and trust my journey.
- ✅ I turn setbacks into comebacks with resilience.
- ✅ I am grateful for every success, big and small.
Success Reflection
"Every effort I made today has planted seeds for my future success. I release any doubts and trust the process. My dreams are possible, and I am getting closer every day. I am grateful, I am strong, and I am ready for more!"
💪 Repeat daily, feel the power, and watch your success unfold!
Task Answer - Video Link
🔹 If you don’t understand the task, watch the video above for the answer.
Task
Step 1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Mini Calculator</title>
</head>
<body>
<h1>🧮 Mini Calculator</h1>
<input type="number" id="num1" placeholder="Enter first number">
<input type="number" id="num2" placeholder="Enter second number">
<br><br>
<button onclick="add()">Add ➕</button>
<button onclick="subtract()">Subtract ➖</button>
<button onclick="multiply()">Multiply ✖️</button>
<h2 id="result">Result will show here...</h2>
<script src="script.js"></script>
</body>
</html>
Step 2
// 🎯 Get input and result elements
const result = document.getElementById("result");
function getNumbers() {
const num1 = parseFloat(document.getElementById("num1").value);
const num2 = parseFloat(document.getElementById("num2").value);
return { num1, num2 };
}
// ➕ Add Function
function add() {
const { num1, num2 } = getNumbers();
const sum = num1 + num2;
result.textContent = `Result: ${sum}`;
}
// ➖ Subtract Function
function subtract() {
const { num1, num2 } = getNumbers();
const difference = num1 - num2;
result.textContent = `Result: ${difference}`;
}
// ✖️ Multiply Function
function multiply() {
const { num1, num2 } = getNumbers();
const product = num1 * num2;
result.textContent = `Result: ${product}`;
}