7 Powerful JavaScript Shorthands That You Should Know
22-Sep-21
คัมภีร์เทพ IT
See the original english version Click here!
ปัจจุบัน JavaScript ถูกใช้งานอย่างแพร่หลาย มันมี Features และ Tools มากมายที่ทำให้ชีวิตของ Developer ง่ายขึ้น นอกจากนี้ยังมี Shorthand เป็นจำนวนมากที่คุณสามารถใช้เขียน JavaScript Code ได้สั้นลงแต่เร็วขึ้น โดยเฉพาะตามข้อกำหนด ECMAScript และนี่ก็เป็น 7 JavaScript Shorthands มีประสิทธิภาพ ที่คุณควรรู้จัก
1. Convert String ไปเป็น Number
โดยปกติ ในการ Convert String ไปเป็น Number เราจะใช้ parseInt() Method แต่อย่างไรก็ตาม มี Shorthand ช่วยให้เราสามารถทำสิ่งนั้นได้เช่นกัน
ด้วยการใช้ Unary Operator + จะทำให้เราสามารถ Convert String ไปเป็น Number ได้อย่างง่ายดาย
นี่คือตัวอย่าง:
อย่างที่คุณเห็นด้านบน เพียงแค่เพิ่มเครื่องหมาย + ไว้ที่ด้านหน้าของตัวแปร speed เราก็สามารถ Convert ตัวแปร speed ที่เดิมเป็น String ให้กลายเป็น Number ได้แล้ว
นอกจากนี้ยังมี Shorthand อีกตัวหนึ่ง ที่จะ Convert จาก Number เป็น String ได้ เพียงแค่ใส่ Empty String ลงไปที่ Number
นี่คือตัวอย่าง:
2. การใช้ Ternary Operator
Shorthand อีกตัวหนึ่งคือ Ternary Operator มันช่วยให้เราเขียน Conditional Statements ให้ง่ายและสั้นลง โดยใช้ ? และ :
นี่คือตัวอย่างการใช้ IF-ELSE Statements:
Longhand:
ด้านล่างนี้เป็นตัวอย่างเดียวกัน แต่ตอนนี้เราจะใช้ Ternary Operator แทน:
Shorthand:
อย่างที่คุณเห็น ด้วยการใช้ Ternary Operator Shorthand เราสามารถลดจำนวน Code ที่ต้องเขียนได้อย่างง่ายดาย นั่นคือใช้ Code เพียงแค่ 2 บรรทัดในการเขียน Conditional Statements
3. Short-Circuit Evaluation
ลองดูตัวอย่าง การใช้ IF Statement ด้านล่างนี้
Longhand:
เราสามารถเขียน Statement เดียวกันได้ โดยใช้ Short Circuit && และนี่ก็คือตัวอย่าง:
Shorthand:
Short Circuit Evaluation && ถือเป็นหนึ่งใน Shorthand ที่ช่วยให้คุณเขียน Conditionals ที่สั้นลงได้ มันถูกใช้งานอยู่ระหว่างค่า 2 ค่า ถ้าค่าแรกเป็น True มันก็จะ Return ค่าที่ 2 กลับมาให้ มิฉะนั้น มันจะ Return ค่าแรกกลับมาให้
4. การทำ Array ให้เหลือมิติเดียว
Shorthand ที่ดีที่สุดเพื่อทำให้ Array หลายมิติเหลือแค่มิติเดียว ก็คือ การใช้ flat() Method อาจมี Developer จำนวนมากที่ใช้ Method อย่าง Filter, Concat รวมทั้ง Method อื่น ๆ ที่ต้องเขียน Code จำนวนมากในการทำให้ Array เหลือแค่มิติเดียว นั้นอาจเป็นเพราะ พวกเขายังไม่รู้เกี่ยวกับ Flat Method
Method ที่น่าทึ่งนี้ จะช่วยทำให้คุณสามารถทำ Array ให้เหลือมิติเดียว โดยใช้ Code เพียงแค่บรรทัดเดียว
นี่คือตัวอย่าง:
5. การ Merge และการ Clone Arrays
เมื่อพูดถึงการ Merge และการ Clone Arrays ใน JavaScript แล้ว Spread Operator {…} ถือเป็น Shorthand ที่ดีที่สุดที่คุณสามารถใช้ได้
การ Merge Arrays:
การ Clone Arrays:
6. For Loop Shorthand
ส่วนใหญ่ เมื่อเราต้องการวน Loop Array ด้วยการใช้ For Loop เราสามารถทำดังนี้:
Longhand:
แต่เราสามารถทำสิ่งเดียวกันได้โดยใช้ for of Loop สำหรับ Shorthand:
Shorthand:
7. Arrow Functions
Arrow Functions เป็น Shorthand ที่ช่วยให้คุณสามารถเขียน Functions ให้ง่ายขึ้นและช่วยลดปริมาณ Code ของคุณอีกด้วย ลองมาดูตัวอย่างกัน:
Function ปกติ:
Arrow Function:
ที่มา: https://medium.com/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
บทความล่าสุด