HTML ትምህርት - ክፍል 7 | If/Else, Loops & Arrays

🤔

If / Else — ውሳኔ // Decision Making

if/else — ሁኔታ ካለ አንድ ነገር ይስራ፣ ካልሆነ ሌላ ነገር ይስራ። ልክ እንደ ሰው ውሳኔ!
if/else lets your code make decisions — "if this is true, do this; otherwise, do that."

💡

ምሳሌ: ዕድሜ 18+ ከሆነ → "ሙሉ ዕድሜ ደርሷል"
ካልሆነ → "ገና ያልደረሰ"
Example: if age >= 18, show "adult"; else show "minor"

📊 If/Else Flowchart:

ኮድ ይጀምራል

↓

❓ ሁኔታ እውነት ነው?
Is condition true?

YES ✅

if ኮድ ይሰራል
if block runs

NO ❌

else ኮድ ይሰራል
else block runs

↓

ቀጥሎ ይሄዳል

ifelse.js

// መሰረታዊ if/else
let age = 20;

if (age >= 18) {
  alert("✅ ሙሉ ዕድሜ ደርሷል!");
} else {
  alert("❌ ገና ያልደረሰ!");
}

// else if — ብዙ ሁኔታ
let score = 85;

if (score >= 90) {
  console.log("🏆 A — እጅግ ጥሩ!");
} else if (score >= 80) {
  console.log("⭐ B — ጥሩ!");
} else if (score >= 70) {
  console.log("👍 C — መካከለኛ");
} else {
  console.log("📚 F — ድጋሚ ሞክር");
}

🎮 Demo — ውጤት ፈታሽ: ቁጥር ጻፍ → ደረጃ ይታያል!
Enter a score and see the grade using if/else!

🔄

Loops — ድግግሞሽ // for & while

Loop — ኮድ ደጋግሞ ለማስሮጥ ይጠቅማል። 100 ጊዜ አንድ ነገር ለማድረግ አንድ loop ይበቃል!
Loops repeat code automatically — instead of writing the same line 100 times, use a loop!

loops.js

// for loop — ቁጥር ጠቅሶ
for (let i = 1; i <= 5; i++) {
  console.log("ቁጥር: " + i);
}
// ውጤት: ቁጥር: 1, ቁጥር: 2 ... ቁጥር: 5

// while loop — ሁኔታ እስካለ ድረስ
let count = 0;
while (count < 3) {
  console.log("ሰላም! " + count);
  count++;
}

// Array ላይ loop
const cities = ["አዲስ አበባ", "ሐዋሳ", "ባህር ዳር"];
for (let city of cities) {
  console.log(city);
}

🎮 Demo — Loop ሙከራ: ቁልፍ ጫን ውጤት ይታይ!
See different loops in action:

👆 ከላይ ያለውን ቁልፍ ጫን...

📋

Arrays — ዝርዝር // Lists of data

Array — ብዙ ዋጋ አንድ variable ውስጥ ለማስቀመጥ ይጠቅማል። ዝርዝር ይመስላል!
Arrays store multiple values in one variable — like a list. Use index [0], [1], [2]... to access items.

⚠️

Array index 0 ይጀምራል! — ፊተኛው item [0] ነው፣ ሁለተኛው [1] ነው።
Arrays start at index 0! First item is [0], second is [1], etc.

arrays.js

// Array መስራት
const fruits = ["ሙዝ", "ብርቱካን", "ማንጎ"];

// Index ተጠቅሞ ማግኘት
console.log(fruits[0]);  // "ሙዝ"
console.log(fruits[1]);  // "ብርቱካን"
console.log(fruits[2]);  // "ማንጎ"

// ርዝመት
console.log(fruits.length); // 3

// Item መጨመር
fruits.push("ፓፓያ");

// መጨረሻ item ማስወገድ
fruits.pop();

// ሁሉንም ማሳየት
fruits.forEach(function(fruit) {
  console.log(fruit);
});

🎮 Demo — Array ሙከራ: items ጨምር፣ አስወግድ!
Live array — add and remove items!

const cities = [...] // index 0 ይጀምራል

          length: 0
        

📌

ዋና ዋና ነጥቦች // Key Takeaways

1

🤔 if/else — ውሳኔ ይወስናል

if (ሁኔታ) { ... } else { ... } — ሁኔታ እውነት ከሆነ if ይሰራል፣ ካልሆነ else ይሰራል።
if runs when condition is true, else runs when false.

2

🔄 for loop — ቁጥር ጠቅሶ ይደግማል

for (let i = 0; i < 10; i++) { ... } — i++ ማለት i = i + 1 ነው።
for loop repeats a set number of times. i++ means increment by 1.

3

📋 Array — ዝርዝር ያስቀምጣል

const list = ["a", "b", "c"] — index 0 ይጀምራል። push() ይጨምራል፣ pop() ያስወግዳል።
Arrays hold lists. Index starts at 0. push() adds, pop() removes.

4

🔗 Loop + Array = ሃይለኛ ጥምረት

for...of loop ተጠቅሞ array ውስጥ ያሉ ሁሉ items ማሳየት ይቻላል።
Loop through arrays with for...of to process each item.

🎯

Quiz // ምን ተማርን?

❓ const cities = ["አዲስ አበባ", "ሐዋሳ", "ባህር ዳር"] — "ሐዋሳ" ለማግኘት ምን ትጽፋለህ?
How do you access "ሐዋሳ" from this array?

A cities[1] ➜ "አዲስ አበባ"... ትክክል አይደለም

B cities[1] ➜ "ሐዋሳ" ✅

C cities[2] ➜ "ሐዋሳ"... ትክክል አይደለም

D cities[0] ➜ "ሐዋሳ"... ትክክል አይደለም

If/Else, Loopsእና Arrays 🔄

If/Else, Loops
እና Arrays 🔄