JavaScript: การทำซ้ำด้วยลูป

JavaScript

EP6 ของชุด JavaScript คืออะไร? เริ่มต้นเขียนโปรแกรม เรียนรู้ for, while, do...while, break, continue และการวนซ้ำข้อมูลด้วยลูปอย่างถูกต้อง

EP6: ทำงานซ้ำอัตโนมัติด้วยลูป

1. for loop: วนซ้ำตามจำนวนรอบ

for (let i = 1; i <= 5; i++) {
    console.log(`รอบที่ ${i}`);
}

// ผลลัพธ์:
// รอบที่ 1
// รอบที่ 2
// รอบที่ 3
// รอบที่ 4
// รอบที่ 5

2. while loop: วนซ้ำตราบใดที่เงื่อนไขเป็นจริง

let count = 1;

while (count <= 3) {
    console.log(`กำลังประมวลผลครั้งที่ ${count}`);
    count++;
}

console.log('ประมวลผลเสร็จแล้ว');

// ผลลัพธ์:
// กำลังประมวลผลครั้งที่ 1
// กำลังประมวลผลครั้งที่ 2
// กำลังประมวลผลครั้งที่ 3
// ประมวลผลเสร็จแล้ว

3. do...while: ทำงานอย่างน้อยหนึ่งครั้ง

let number = 10;

do {
    console.log(`ค่าปัจจุบันคือ ${number}`);
    number++;
} while (number < 5);

// ผลลัพธ์:
// ค่าปัจจุบันคือ 10

4. เปรียบเทียบลูปทั้งสามชนิด

5. break: หยุดลูปทันที

const productIds = [101, 205, 308, 412, 509];
const targetId = 308;
let found = false;

for (const id of productIds) {
    console.log(`ตรวจสอบสินค้า ${id}`);

    if (id === targetId) {
        found = true;
        console.log('พบสินค้าที่ต้องการ');
        break;
    }
}

console.log(`ผลการค้นหา: ${found ? 'พบ' : 'ไม่พบ'}`);

// ผลลัพธ์บางส่วน:
// ตรวจสอบสินค้า 101
// ตรวจสอบสินค้า 205
// ตรวจสอบสินค้า 308
// พบสินค้าที่ต้องการ
// ผลการค้นหา: พบ

6. continue: ข้ามรอบปัจจุบัน

for (let i = 1; i <= 5; i++) {
    if (i === 3) {
        continue;
    }

    console.log(i);
}

// ผลลัพธ์:
// 1
// 2
// 4
// 5

7. วนซ้ำสมาชิกใน Array ด้วย for...of

const products = [
    'คีย์บอร์ด',
    'เมาส์',
    'จอภาพ'
];

for (const product of products) {
    console.log(`สินค้า: ${product}`);
}

// ผลลัพธ์:
// สินค้า: คีย์บอร์ด
// สินค้า: เมาส์
// สินค้า: จอภาพ

8. วนซ้ำข้อมูลแบบ key-value ด้วย for...in

const product = {
    name: 'Mechanical Keyboard',
    price: 1590,
    stock: 12
};

for (const key in product) {
    console.log(`${key}: ${product[key]}`);
}

// ผลลัพธ์:
// name: Mechanical Keyboard
// price: 1590
// stock: 12

9. ตัวอย่างจริง: คำนวณยอดขายจากรายการสินค้า

const sales = [
    { name: 'Keyboard', price: 1200, quantity: 2 },
    { name: 'Mouse', price: 450, quantity: 3 },
    { name: 'Monitor', price: 5200, quantity: 1 }
];

let totalRevenue = 0;
let totalItems = 0;

for (const item of sales) {
    const subtotal = item.price * item.quantity;
    totalRevenue += subtotal;
    totalItems += item.quantity;

    console.log(`${item.name}: ${subtotal} บาท`);
}

console.log(`จำนวนสินค้ารวม: ${totalItems} ชิ้น`);
console.log(`ยอดขายรวม: ${totalRevenue} บาท`);

// ผลลัพธ์:
// Keyboard: 2400 บาท
// Mouse: 1350 บาท
// Monitor: 5200 บาท
// จำนวนสินค้ารวม: 6 ชิ้น
// ยอดขายรวม: 8950 บาท

10. การวิเคราะห์จำนวนรอบและประสิทธิภาพ

จำนวนรอบของลูปแบบเพิ่มทีละหนึ่ง

const n = 5;
let iterations = 0;

for (let i = 1; i <= n; i++) {
    iterations++;
}

console.log(`จำนวนรอบทั้งหมด: ${iterations}`);

// ผลลัพธ์: จำนวนรอบทั้งหมด: 5

11. ข้อผิดพลาดที่พบบ่อยในการใช้ลูป

12. แบบฝึกหัดท้ายบท

13. สรุปและเตรียมพร้อมสำหรับ EP7