บทความ IT เจ๋งๆ

เชื่อว่า Programmer/Developer ล้วนเคยผ่านการใช้งาน For Loops ในการ Coding กันมาแล้ว ไม่ว่าจะตอนเรียนหรือตอนทำงานจริง และจำเป็นที่คุณต้องเลือกใช้มันให้เหมาะกับแต่ละสถานการณ์ สำหรับคนที่ใช้ JavaScript ผู้เขียนบทความนี้แนะนำว่า ไม่ควรใช้ For Loop ใน Arrays แต่ขอแนะนำให้ใช้ .forEach() Method แทน

.forEach() Method คืออะไร

ในฐานะของ Built-in Method ใน Array Class นั้น .forEach() ได้รับการเปิดตัวใน ECMAScript 2015 (หรือที่เรียกกันว่า ES6)

จากข้อมูลอ้างอิงของ Documentation ของ Mozilla นั้น Method จะทำการ Callback เป็น Arguments และเพื่อไม่ให้เกิดปัญหาขึ้น Callback จะเป็น Function ที่ถูก Execute สำหรับทุก item ใน Array การใช้ .forEach() เหมาะสมที่สุดสำหรับ Function โดยมันจะทำกับทุก item โดย Function จะ Require 1 Parameter, Value กับ 3 Optional Parameters สำหรับ Index, Base Array และ Assigned this Value ตามลำดับ

ตัวอย่าง

เพื่อแสดงถึงการใช้งานพื้นฐานของ .forEach() Method เรามาเริ่มด้วยการ Define Array ของ Integer แล้ว Print ค่าที่เป็น ยกกำลัง2 ของพวกมันลงใน Console ดู

การเพิ่ม Index เข้าไป

แล้วถ้าเราต้องการ Print ค่า Index ลงไปด้วยล่ะ จะทำอย่างไรดี? เราได้ทำการเพิ่ม Optional Parameter ตัวที่ 2 เข้าไปใน Function Definition ของเรา

การจัดเก็บค่าด้วย .forEach()

แล้วถ้าคุณไม่ต้องการที่จะ Print ทุกอย่าง แต่อยากเก็บ Result ไว้ในตัวแปรใหม่ล่ะ?

จากตัวอย่าง Code ด้านบน คุณจะเห็นว่า .forEach() Method ไม่มีการ Return ใด ๆ กลับมาให้ ความจริงก็คือ การใช้ .map() Method ดูจะเป็นคำตอบที่ดีที่สุดในสถานการณ์นี้ แต่อย่างไรก็ตาม หากต้องการใช้ .forEach() เราสามารถเขียน Code ใหม่ได้ดังด้านล่างนี้

การทำให้ Callback Function สั้นกระชับขึ้น

หากคุณต้องการทำให้ Code ของคุณให้สั้นกระชับมากขึ้น ก็ลองเปลี่ยน Callback Function ด้วย Arrow Function ดู

ที่จริงแล้ว ถ้าคุณจะใช้เฉพาะ Value (ไม่มี Optional Parameters) คุณก็ไม่ต้องใส่วงเล็บของ n และถ้า Loop ของคุณใช้เพียงคำสั่งเดียว คุณก็ไม่ต้องใส่วงเล็บปีกกาก็ได้

สามารถใช้กับค่าที่เป็นลบได้หรือไม่

คำตอบสั้น ๆ คือ “ได้” และมักจะมีข้อจำกัดบางอย่างในการเลือกวิธีเขียน Code ของคุณ หนึ่งในข้อด้อยที่อาจเกิดขึ้น (แต่มันก็ไม่เชิงจะเป็นข้อด้อยไปซะทีเดียว เป็นเพียงแค่การพยายามใช้วิธีที่เหมาะสมกว่าเท่านั้น) ก็คือ คุณจะไม่สามารถปรับเปลี่ยนค่าดั้งเดิมในแต่ละ Index ได้อีกแล้ว ตามตัวอย่างด้านล่างนี้

ที่มา:  https://medium.com/

รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert

อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ

บทความล่าสุด

• 7 Projects สนุก ๆ ที่สามารถใช้ฝึกฝนทักษะ Coding
• เคล็ดลับการจัดการกับ Configuration File ใน Python 
• 7 ไอเดียของ App ที่คุณสามารถนำไปฝึก Coding ได้