เมธอด .map() ของ JavaScript เป็นวิธีการอาร์เรย์ที่ใช้ในการสร้างอาร์เรย์ใหม่ที่มีความยาวเท่ากับอาร์เรย์ดั้งเดิม แต่แต่ละองค์ประกอบได้รับการแก้ไขตามฟังก์ชันเรียกกลับที่ให้มา เมธอดนี้ไม่ได้แก้ไขอาร์เรย์ดั้งเดิม แต่จะส่งคืนอาร์เรย์ใหม่ที่มีองค์ประกอบที่แก้ไขแทน
ไวยากรณ์สำหรับเมธอด .map() คือ follwos
array.map(callback(currentValue[, index[, array]])[, thisArg])j
ฟังก์ชันการโทรกลับรับสามอาร์กิวเมนต์: currentValue, ดัชนี (เป็นทางเลือก) และอาร์เรย์ (เป็นทางเลือก) อาร์กิวเมนต์ currentValue คือองค์ประกอบปัจจุบันที่กำลังประมวลผลในอาร์เรย์ อาร์กิวเมนต์ดัชนีคือดัชนีขององค์ประกอบปัจจุบันที่กำลังประมวลผล และอาร์กิวเมนต์อาร์เรย์คืออาร์เรย์ดั้งเดิมที่เรียกใช้เมธอด .map()
นี่คือตัวอย่างของการใช้เมธอด .map() เพื่อสร้างอาร์เรย์ใหม่โดยแต่ละองค์ประกอบคูณด้วย 2
const numbers = [1, 2, 3, 4, 5]; const doubledNumbers = numbers.map(num => num * 2); console.log(doubledNumbers); // Output: [2, 4, 6, 8, 10]
ในตัวอย่างข้างต้น มีการเรียกใช้เมธอด .map() บนอาร์เรย์ตัวเลข โดยส่งผ่านฟังก์ชันการเรียกกลับที่รับอาร์กิวเมนต์ num และส่งกลับค่า num คูณด้วย 2 ผลลัพธ์อาร์เรย์ใหม่ doubledNumbers จะถูกบันทึกลงในคอนโซล .
สิ่งสำคัญสิ่งหนึ่งที่ควรทราบเกี่ยวกับเมธอด .map() ก็คือ มันไม่ได้แก้ไขอาร์เรย์ดั้งเดิม มันสร้างอาร์เรย์ใหม่พร้อมองค์ประกอบที่แก้ไข หากคุณต้องการแก้ไขอาร์เรย์ดั้งเดิม คุณจะต้องใช้วิธีการอื่น เช่น .forEach() หรือ .splice()
โดยสรุป เมธอด .map() เป็นเครื่องมืออันทรงพลังที่สามารถช่วยคุณสร้างอาร์เรย์ใหม่ที่มีองค์ประกอบที่แก้ไขตามฟังก์ชันเรียกกลับได้ ด้วยความเข้าใจที่ดีเกี่ยวกับวิธีการใช้วิธีนี้ คุณสามารถจัดการอาร์เรย์ใน JavaScript ให้เหมาะกับความต้องการของคุณได้อย่างง่ายดาย
อีกตัวอย่างหนึ่งของการใช้เมธอด .map() คือการแปลงอาร์เรย์ของสตริงเป็นตัวพิมพ์ใหญ่ นี่คือตัวอย่าง:
const names = ['john', 'susan', 'peter']; const uppercasedNames = names.map(name => name.toUpperCase()); console.log(uppercasedNames); // Output: ['JOHN', 'SUSAN', 'PETER']
ในตัวอย่างด้านบน มีการเรียกใช้เมธอด .map() บนอาร์เรย์ชื่อ โดยส่งผ่านฟังก์ชันการเรียกกลับที่รับอาร์กิวเมนต์ชื่อและส่งกลับเวอร์ชันตัวพิมพ์ใหญ่ของชื่อโดยใช้เมธอด toUpperCase() จากนั้นอาร์เรย์ใหม่ที่เป็นผลลัพธ์ตัวพิมพ์ใหญ่จะถูกบันทึกลงในคอนโซล
สิ่งสำคัญคือต้องทราบว่าเมธอด .map() ยังสามารถเชื่อมโยงกับวิธีอาเรย์อื่นๆ เช่น .filter() และ .reduce() เพื่อให้ได้ฟังก์ชันการทำงานที่ซับซ้อนมากขึ้น
โดยรวมแล้ว เมธอด .map() เป็นเครื่องมือที่ทรงพลังและอเนกประสงค์สำหรับการทำงานกับอาร์เรย์ใน JavaScript เมื่อเข้าใจวิธีการใช้วิธีนี้แล้ว คุณสามารถจัดการและแปลงอาร์เรย์ให้เหมาะกับความต้องการของคุณได้อย่างง่ายดาย
