COOL IT IDEAS AND STUFF

See the original english version Click here!

เมื่อคุณทำงานกับภาษา Programming ภาษาหนึ่งเป็นเวลานาน ๆ คุณอาจเริ่มหน่ายและไม่ค่อยอยากเรียนรู้สิ่งใหม่ ๆ แต่การทำงานในแวดวงไอทีและเทคโนโลยี ทำให้จำเป็นต้องเรียนรู้สิ่งใหม่ ๆ และพัฒนาตัวเองอยู่ตลอดเวลา บทความนี้จะกล่าวถึง 5 JavaScript Functions สุดมีประโยชน์ ที่รู้ไว้ก็ไม่เสียหาย

1. Hoisted vs Non-Hoisted Functions

มีวิธีในการ Define Function อยู่ 3 วิธี:

สิ่งที่น่าสนใจคือ สิ่งที่เกิดขึ้นเมื่อเราเรียกใช้ Function เหล่านั้น

Function ที่ถูก Declare โดยใช้ Syntax การ Define Function แบบมาตรฐานจะถูก Hoist ไปที่ด้านบนสุดของ Scope ของมัน ซึ่งหมายความว่า คุณสามารถเรียกใช้ Function เหล่านี้ก่อนที่มันจะถูก Define ใน Code และ Function เหล่านี้จะยังคงทำงานได้อยู่

2. Arrow Function และการการใช้กับ this

• regularMethod: นี่คือ Regular Function เมื่อเราเรียกใช้ person.regularMethod() คำสั่ง this ภายใน regularMethod จะอ้างอิงถึง person Object ดังนั้น this.name จะให้ค่า "John" 
• arrowMethod: นี่คือ Arrow Function ซึ่งไม่มี this เป็นของตัวเอง แต่จะ Inherit this จาก Lexical Scope ที่อยู่รอบ ๆ (ซึ่งในกรณีนี้คือ Global Scope) ดังนั้นเมื่อเราเรียกใช้ person.arrowMethod() ค่าของ this จะไม่อ้างถึง person Object และ this.name จะให้ค่า undefined

มาดูตัวอย่างอื่นกัน:

• regularMethod กับ setTimeout: ในที่นี่ setTimeout จะถูกส่ง Regular Function ใน JavaScript เมื่อ Regular Function ถูกเรียกใช้ภายใน setTimeout ค่าของ this จะไม่อ้างถึง person Object อีกต่อไป แต่จะอ้างถึง Global Object (หรือ undefined ใน Strict Mode) นั่นคือเหตุผลที่ this.name ให้ค่า undefined
• regularMethod2 กับ setTimeout: Function ที่อยู่ภายใน setTimeout เป็น Arrow Function ซึ่งไม่มี this เป็นของตัวเอง แต่ this จะถูก Lexically Bound (การที่ค่าของ this ถูกกำหนดโดย “ตำแหน่ง” ที่ Function ถูกประกาศใน Code ไม่ใช่โดย “วิธีที่มันถูกเรียกใช้”) ให้กับ this ของ arrowMethod ซึ่งก็คือ person ดังนั้น this.name จะให้ค่าที่ถูกต้องออกมาคือ "John"

3. Function Parameters ที่ใช้ Rest Parameters

Rest Parameter (…) มีประโยชน์ในการรวบรวมค่าหลาย ๆ ประเภทให้อยู่ใน Option เดียว คุณามารถใช้มันเพื่อมีการ Define Function ที่ยืดหยุ่นมากขึ้น และแยก Optional Parameters ออกจาก Required Parameter

4. Higher-Order Functions

Higher-Order Functions มีประโยชน์สำหรับการเพิ่ม Functionality ทั่วไป (เช่น Logging, Error Handling หรือ Performance Testing) ให้กับ Function ต่าง ๆ

5. Function Composition

Function Composition คือการรวมหลาย ๆ Functions เข้าด้วยกัน โดยที่ ผลลัพธ์ของแต่ละ Function จะถูกนำไปเป็นInput ของ Function ถัดไป วิธีนี้ช่วยให้ Logic ที่มีความซับซ้อน มีความเป็น Module และนำกลับมา Reuse ได้ง่ายขึ้น โดยแบ่งออกเป็นส่วนเล็ก ๆ ที่สามารถ Test ได้ เหมาะสำหรับงานที่เกี่ยวกับ Data Processing หรือ Transformation

ที่มา: https://levelup.gitconnected.com/

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

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

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

• 7 Command-Line Tools ที่มีประโยชน์ต่อ Development Workflow ของคุณ
• 17 Repositories สุดเจ๋งบน GitHub ที่คุณอาจไม่เคยรู้ว่ามีอยู่
• IT & Digital Events in February 2025