ภาษาจาวาสคริปต์ (JavaScript ) มีเมธอดที่เป็น iterator ซึ่งจะทำหน้าที่วนรอบอ่านข้อมูลจากสมาชิกในอาเรย์ทีละตัวมาดำเนินการตามที่กำหนด ในที่นี้เราจะทำความรู้จักกับเมธอดหลักๆที่ใช้งานกันบ่อยๆบางตัว สำหรับเมธอดและคุณสมบัติทั้งหมด
ของอาเรย์สามารถดูได้จาก https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array การใช้งานเมธอดที่เป็น iterator นี้จะเป็นการใช้งานในแบบ high order function คือเราจะส่งฟังก์ชั่น (callback function) เป็นพารามิเตอร์ให้เมธอดที่เป็น iterator เพื่อให้เมธอดดำเนินการกับทุกข้อมูลในอาเรย์ด้วยคำสั่งเดียวกันตามที่กำหนดในฟังก์ชั่น
เมธอด forEach() ใช้เพื่อดำเนินการกับทุกข้อมูลในอาเรย์ด้วยฟังก์ชั่นเดียวกันโดยไม่มีการเปลี่ยนแปลงใดๆกับอาเรย์ที่ดำเนินการ และจะส่งค่ากลับเป็น undefined ตัวอย่างด้านล่างเป็นการอ่านข้อมูลแต่ละตัวจากอาเรย์ออกมาพิมพ์ โดยแสดงการใช้งานทั้งในรูปแบบฟังก์ชั่นปรกติ แบบ anonymous function และแบบ arrow function
// แบบที่ 1
const myArray = [1,2,3];
function printMyValue(myValue){
console.log(myValue);
}
myArray.forEach(printMyValue);
พิมพ์ 1 2 3
//แบบที่ 2
const myArray = [1,2,3];
myArray.forEach(function(myValue){
console.log(myValue);
});
พิมพ์ 1 2 3
// แบบที่ 3
const myArray = [1,2,3];
myArray.forEach(myValue => console.log(myValue));
พิมพ์ 1 2 3
เมธอด map() ใช้เพื่อดำเนินการกับทุกข้อมูลในอาเรย์ด้วยฟังก์ชั่นเดียวกันโดยผลลัพธ์ที่ได้จะเก็บในอาเรย์ใหม่ และไม่มีการเปลี่ยนแปลงใดๆกับอาเรย์ต้นทาง
const myArray = [1,2,3];
const result = myArray.map(myValue => myValue + 1); // +1 ทุกสมาชิก
console.log(result); // พิมพ์ [ 2, 3, 4 ] จากอาเรย์ใหม่
console.log(myArray); // พิมพ์ [ 1, 2, 3 ] เพื่อแสดงว่าอาเรย์เดิมไม่ถูกเปลี่ยนแปลง
เมธอด filter() ใช้เพื่อตรวจสอบทุกข้อมูลในอาเรย์ด้วยเงื่อนไขเดียวกันโดยผลลัพธ์ที่ได้จะเก็บในอาเรย์ใหม่ และไม่มีการเปลี่ยนแปลงใดๆกับอาเรย์ต้นทาง ข้อมูลแต่ละตัวจะถูกตรวจสอบตามเงื่อนไขที่กำหนดและหากผลการตรวจสอบเป็น true ข้อมูลนั้นจะถูกเพิ่มในอาเรย์ใหม่
const myArray = [1,2,3];
const result = myArray.filter(myValue => myValue > 1); // คัดเฉพาะที่มีค่ามากกว่า 1
console.log(result); // พิมพ์ [ 2, 3 ] จากอาเรย์ใหม่
console.log(myArray); // พิมพ์ [ 1, 2, 3 ] เพื่อแสดงว่าอาเรย์เดิมไม่ถูกเปลี่ยนแปลง
เมธอด findIndex() ใช้เพื่อตรวจสอบทุกข้อมูลในอาเรย์ด้วยเงื่อนไขเดียวกัน ข้อมูลแต่ละตัวจะถูกตรวจสอบตามเงื่อนไขที่กำหนดและหากผลการตรวจสอบเป็น true และจะได้ผลลัพธ์เป็นดัชนีของข้อมูลแรกที่พบว่าเป็นไปตามเงื่อนไข หากไม่มีข้อมูลตรงตามเงื่อนไขจะได้ผลลัพธ์เป็น -1
const myArray = [1,2,3];
let result = myArray.findIndex(myValue => myValue > 1); // หาดัชนีของข้อมูลที่มีค่ามากกว่า 1
console.log(result); //พิมพ์ 1
console.log(myArray); พิมพ์ [ 1, 2, 3 ] เพื่อแสดงว่าอาเรย์เดิมไม่ถูกเปลี่ยนแปลง
เมธอด reduce() ใช้เพื่อดำเนินการกับทุกข้อมูลในอาเรย์ด้วยฟังก์ชั่นเดียวกันจนได้ผลลัพธ์ออกมาเป็นค่าเดียว โดยใน callback function ต้องกำหนดพารามิเตอร์สำหรับเก็บผลลัพธ์ในแต่ละรอบของการดำเนินการและเก็บข้อมูลของสมาชิกในตำแหน่งปัจจุบัน โดยการวนรอบจะนำค่าของสมาชิกในตำแหน่งปัจจุบันไปดำเนินการกับผลลัพธ์ที่ได้ก่อนหน้า และวนทำไปเรื่อย ๆ จนกว่าจะครบทุกข้อมูล และส่งค่ากลับออกมาเป็นผลลัพธ์สุดท้าย เช่น
const numbers = [1, 2, 4, 10];
const summedNums = numbers.reduce((accumulator, currentValue) => {
return accumulator + currentValue;
})
console.log(summedNums) // พิมพ์ 17