0Pricing
Javascript for Kids · บทเรียน

ลูปซ้อนลูป

ลูปที่อยู่ภายในลูป

ลูปซ้อนลูป เป็นบทเรียน Javascript for Kids ฟรีบน CoddyKit นี่คือบทเรียนที่ 1 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Javascript for Kids และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Javascript for Kids มีบทเรียนทั้งหมด 4 บทเรียน

ลูปซ้อนลูป?! 🤯

จะเกิดอะไรขึ้นถ้าใส่ลูปไว้ INSIDE ลูปอีกอันหนึ่ง? ก็เหมือนล้อวงหนึ่งหมุนอยู่ภายในล้อที่ใหญ่กว่า! ⚙️⚙️

สิ่งนี้เรียกว่า ลูปซ้อน และใช้สร้างงานศิลปะที่น่าทึ่งได้!

ด้านนอกและด้านใน 🪆

ลองนึกถึงตุ๊กตาแม่ลูกดก! 🪆 ลูปด้านนอกคือแม่ตุ๊กตาตัวใหญ่ ส่วนลูปด้านในคือตุ๊กตาตัวเล็กที่อยู่ข้างใน

ในทุก ๆ ONE รอบของลูปด้านนอก ลูปด้านในจะทำงานครบ ALL รอบของมัน!

ลูปซ้อนอันแรก 🔁

ในตัวอย่างนี้ ลูปด้านนอกทำงาน 2 รอบ และในแต่ละรอบ ลูปด้านในทำงาน 3 รอบ! ตั้งใจดูให้ดีนะครับ

for (let i = 1; i <= 2; i++) {
  for (let j = 1; j <= 3; j++) {
    console.log('i=' + i + ' j=' + j)
  }
}

ตัวนับสองตัว! ✌️

เห็นไหมครับ? ตอนนี้เรามีตัวนับ TWO ตัว: i สำหรับลูปด้านนอก และ j สำหรับลูปด้านใน

j ด้านในจะเป็น 1, 2, 3 ทุกครั้งที่ i ด้านนอกเปลี่ยนค่า!

for (let i = 1; i <= 2; i++) {
  console.log('Outer ' + i + ' starts')
  for (let j = 1; j <= 2; j++) {
    console.log('  inner ' + j)
  }
}

รวมทั้งหมดกี่รอบ? 🔢

ถ้าลูปด้านนอกทำงาน 3 รอบ และลูปด้านในทำงาน 4 รอบ จะเท่ากับ 3 × 4 = 12 รอบทั้งหมด!

มานับรอบเหล่านี้กันเถอะ

let count = 0
for (let i = 1; i <= 3; i++) {
  for (let j = 1; j <= 4; j++) {
    count = count + 1
  }
}
console.log('Total runs: ' + count)

วันและมื้ออาหาร 🍽️

ตัวอย่างในชีวิตจริง! ในแต่ละ DAY เรารับประทานอาหาร 3 MEALS ลูปด้านนอกแทนจำนวนวัน ส่วนลูปด้านในแทนมื้ออาหาร

for (let day = 1; day <= 2; day++) {
  console.log('Day ' + day)
  for (let meal = 1; meal <= 3; meal++) {
    console.log('  meal ' + meal)
  }
}

ดาวในแถว ⭐

ลูปด้านนอกสร้าง ROWS ส่วนลูปด้านในแสดงดาวในแถวนั้น ลองดูตัวอย่างงานศิลปะล่วงหน้าได้เลย!

for (let row = 1; row <= 3; row++) {
  for (let s = 1; s <= 2; s++) {
    console.log('star')
  }
  console.log('--- end of row ---')
}

ลำดับมีความสำคัญ 📋

ลูปด้านในจะทำงานครบ ALL รอบก่อนที่ลูปด้านนอกจะไปต่อเสมอ เหมือนการอ่านทุกคำในบรรทัดหนึ่งให้จบก่อนจะไปยังบรรทัดถัดไป! 📖

for (let i = 1; i <= 2; i++) {
  for (let j = 1; j <= 2; j++) {
    console.log(i + ',' + j)
  }
}

การคูณตัวเลข ✖️

ลูปซ้อนเหมาะมากสำหรับคณิตศาสตร์! มาคูณ i และ j เข้าด้วยกันกันเถอะ

for (let i = 1; i <= 2; i++) {
  for (let j = 1; j <= 3; j++) {
    console.log(i + ' x ' + j + ' = ' + (i * j))
  }
}

เลือกชุดเสื้อผ้า 👕👖

เสื้อ 2 ตัวและ pants 2 ตัว รวมกันเป็นชุดได้ 4 ชุด! ลูปซ้อนจะแสดงชุดผสมทุกแบบ

for (let shirt = 1; shirt <= 2; shirt++) {
  for (let pants = 1; pants <= 2; pants++) {
    console.log('Shirt ' + shirt + ' with pants ' + pants)
  }
}

ถึงตาคุณสร้างลูปซ้อนแล้ว 🌟

เปลี่ยนลูปด้านในให้ทำงาน 4 รอบแล้วเรียกใช้ดู! สังเกตว่าผลลัพธ์เพิ่มขึ้นอย่างไร 🪆

for (let i = 1; i <= 2; i++) {
  for (let j = 1; j <= 4; j++) {
    console.log('i=' + i + ' j=' + j)
  }
}

ตรวจสอบอย่างรวดเร็ว ✅

ตรวจสอบความเข้าใจเรื่องลูปซ้อน! 🧠

ทบทวนลูปซ้อน 🎉

น่าทึ่งจนแทบไม่เชื่อ! 🤯 คุณเรียนรู้ลูปซ้อนแล้ว

  • ลูปหนึ่งอยู่ INSIDE อีกลูปหนึ่ง เหมือนตุ๊กตาแม่ลูกดก 🪆
  • ตัวนับด้านนอกคือ i และตัวนับด้านในคือ j
  • ลูปด้านในจะทำงานจนจบก่อนที่ลูปด้านนอกจะไปต่อ

ถัดไป: สร้างแถวและคอลัมน์ให้เหมือนตารางช่อง! 🟦

คำถามที่พบบ่อย

บทเรียน “ลูปซ้อนลูป” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “ลูปซ้อนลูป” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Javascript for Kids ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Javascript for Kids มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “ลูปซ้อนลูป”

ลูปที่อยู่ภายในลูป คุณปฏิบัติ Javascript for Kids ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Javascript for Kids หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน Javascript for Kids บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 1 จากทั้งหมด 4 บทเรียน

บทเรียน “ลูปซ้อนลูป” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน Javascript for Kids นี้ได้ไหม

ได้ บทเรียน Javascript for Kids ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. ลูปซ้อนลูป
  2. แถวและคอลัมน์
  3. สามเหลี่ยมดาว
  4. ตารางสูตรคูณ
← กลับไปที่ Javascript for Kids