เมธอด forEach() ใน JavaScript

Array.forEach()

วนลูปทำงานกับ ทุกสมาชิก ใน Array เรียงลำดับ ไม่คืนค่า (Return undefined) ใช้สำหรับ Side Effects (แสดงผล, บันทึก, API Call)

ไวยากรณ์

arr.forEach(callback(currentValue[, index[, array]])[, thisArg])

ตัวอย่าง 1: แสดงค่าทุกตัว

<html> <body> <p id="demo"></p> <script>
  var output = '';
  var values = [1, 2, 3, 4, 5];
  
  values.forEach(function(value, index, array) {
    output += value + '<br>';
  });
  
  document.getElementById("demo").innerHTML = output;
</script> </body> </html>

ผลลัพธ์: แสดง 1 ถึง 5 ทีละบรรทัด

ตัวอย่าง 2: Arrow Function (ES6)

<script>
  var array = ['Ram', 'Rahim', 'Remo'];
  array.forEach(e => {
    document.write(e + '<br>');
  });
</script>

ผลลัพธ์: Ram, Rahim, Remo (แยกบรรทัด)

ข้อจำกัดสำคัญ

• ไม่สามารถ Break/Continue ได้ (ใช้ for...of แทน)
• ไม่คืนค่า (ใช้ map/filter/reduce แทน)
• Async/Await ไม่ทำงาน ตรงๆ ใน Callback (ต้อง用 for...of)

เมื่อไหร่ควรใช้ forEach?

• Logging, Debugging
• DOM Manipulation ทีละตัว
• Side Effects ที่ไม่ต้องการ Return Value