บทความ IT เจ๋งๆ
19 Coding Standards ที่ช่วยให้ JavaScript Code ของคุณ Clean มากขึ้น
09-ก.ย.-20
คัมภีร์เทพ IT
Developer ที่เขียน Code ทุกคนล้วนอยากให้ Code ของพวกเขา Clean โดยในบทความนี้จะมาบอกถึง 19 Coding Standards ที่ช่วยให้ JavaScript Code ของคุณ Clean มากขึ้น
สำหรับ Coding Standards ที่กำลังจะกล่าวถึงนี้ จะช่วยทำให้ Code ของคุณ:
- มีความสอดคล้องกัน
- ง่ายในการอ่านและทำความเข้าใจ
- ง่ายในการ Maintain
1. เมื่อมีการเปรียบเทียบ ให้ใช้ === แทนการใช้ ==
สิ่งนี้มีความสำคัญ เนื่องจาก JavaScript เป็น Dynamic Language ดังนั้น การใช้ == อาจจะได้ผลลัพธ์ที่คุณไม่คาดคิดก็ได้
ไม่แนะนำ:
แนะนำ:
2. ให้ใช้ let แทนการใช้ var
มันเป็นวิธีที่เรียบง่าย คือ การใช้ let จะช่วยแก้ปัญหาเกี่ยวกับ Scope ของ var ใน JavaScript
ไม่แนะนำ:
แนะนำ:
3. ให้ใช้ const แทนการใช้ let
ในบางกรณี การใช้ const จะช่วยหยุด Developer ที่พยายามเปลี่ยนแปลงในสิ่งที่ไม่ควรจะเปลี่ยน และช่วยให้การอ่านทำความเข้าใจทำได้ง่ายขึ้น
ไม่แนะนำ:
แนะนำ:
4. ใช้ Semicolons (;) อยู่เสมอ
แม้ว่า JavaScript จะไม่ได้บังคับให้ใส่ Semicolon (;) เมื่อสิ้นสุด Statement เหมือนอย่างภาษาอื่น ๆ แต่การใช้ ; จะช่วยให้ Code มีความสอดคล้องกัน และมีประโยชน์ในเรื่องการเป็นตัวคั่นแต่ละ Statement
ไม่แนะนำ:
แนะนำ:
5. มาตรฐานการตั้งชื่อตัวแปร (Naming Conventions) ใน JavaScript
let : ควรเป็นรูปแบบ camelCase
const : ถ้าอยู่ที่ส่วนบนของ File ให้ใช้ Upper Case Snake Case อย่างเช่น MY_CONST แต่หากถ้าไม่อยู่ที่ส่วนบนของ File ให้ใช้ camelCase
class : ควรใช้เป็น PascalCasing อย่างเช่น MyClass
function : ควรใช้เป็น camelCase อย่างเช่น myFunction
6. ใช้ Template Literals เมื่อต้องการนำ Strings มาต่อกัน
Template Literals เป็น String Literals ที่อนุญาตให้ใช้ Embedded Expressions ได้
ใน IE11 หรือ Version ที่ต่ำกว่า จะไม่รองรับ String Literals
ไม่แนะนำ:
แนะนำ:
7.หากเป็นไปได้ ให้ใช้ ES6 Arrow Functions
Arrow Functions เป็น Syntax ที่ช่วยเพิ่มความกระชับในการเขียน Function Expression พวกมันไม่มีลักษณะเฉพาะและเปลี่ยนวิธีการใช้ this ใน Function
ไม่แนะนำ:
แนะนำ:
8. ใช้วงเล็บปีกกาครอบ Control Structures เสมอ
เราจำเป็นต้องใช้วงเล็บสำหรับ Control Structures ทั้งหมด (เช่น if, else, for, do, while และอื่น ๆ)
คุณอาจรู้สึกว่ามันไม่ได้จำเป็นมากในกรณีที่เราใช้ if statement ในบรรทัดเดียว แต่บ่อยครั้ง สิ่งนี้ก็เป็นสาเหตุให้เกิดความผิดพลาดเมื่อเราไม่ใช้วงเล็บปีกกา ซึ่งอาจทำให้ Developers เผลอเพิ่ม statement อื่น ๆ เข้าไปภายใต้ conditional statement ที่อยู่โดยรอบ
ตัวอย่าง
นี่คือสิ่งที่ควรจะเป็น:
ไม่แนะนำ:
แนะนำ:
9. ตรวจสอบใน JavaScript ให้แน่ใจว่า ให้วงเล็บปีกกาเปิด อยู่ในบรรทัดเดียวกันกับ statement โดยมีช่องว่างคั่นกลาง
ไม่แนะนำ:
แนะนำ:
10. พยายามลดการใช้รูปแบบ Nesting (การซ้อนกัน)
หากคุณใช้ if ซ้อนภายใน if อาจทำให้เกิดความยุ่งเหยิงและทำให้อ่านยากมากขึ้น บางครั้งคุณอาจไม่สามารถหลีกเลี่ยงได้ แต่คุณควรดู Structure ของ JavaScript อยู่เสมอ ว่า คุณจะสามารถเปลี่ยนแปลงมันได้หรือไม่
ไม่แนะนำ:
แนะนำ:
คุณสามารถเห็นได้จากตัวอย่างด้านบนนี้ว่า มันอ่านได้ง่ายกว่า ถ้าเป็นไปได้ เชื่อว่าคงมีหลายคนที่พยายามหลีกเลี่ยงไปใช้อย่างอื่น เคล็ดลับอีกข้อหนึ่งก็คือให้ลองตรวจสอบดูก่อน เหมือนอย่างด้านล่างนี้:
ไม่แนะนำ:
แนะนำ:
11. ลองสร้างความยาวบรรทัด "สูงสุด" สำหรับ File และ Function ต่างๆ
นี่อาจเป็นเรื่องยาก เนื่องจากแต่ละ Application ก็มีความแตกต่างกัน สิ่งสำคัญก็คือต้องมีคำแนะนำ เมื่อคุณคิดว่าบางส่วนของ Code มีขนาดที่ใหญ่มากเกินไป การทำแบบนี้อาจต้องใช้เวลาทดลองเล็กน้อยเพื่อหาความยาวที่เหมาะสมสำหรับคุณ
ตัวอย่าง:
File: ประกอบไปด้วย Code จำนวน 80 บรรทัด
Function: ประกอบไปด้วย Code จำนวน 15 บรรทัด
12. ใช้อักษรตัวพิมพ์เล็กกับชื่อ File
เช่น จาก MyFile.js ควรเป็น myFile.js
13. ใช้ Default Parameters หากเป็นไปได้
ใน JavaScript หากคุณไม่ส่งค่าไปยัง Parameter เมื่อเรียกใช้ Function มันจะเป็น undefined
ไม่แนะนำ:
แนะนำ:
14. ควรใช้ break และมี default ใน Switch Statements
หากคุณจำเป็นต้องใช้ Switch Statements ควรตรวจสอบให้แน่ใจว่า คุณมี break แต่ละ condition และใช้ default ด้วย
ไม่แนะนำ:
แนะนำ:
15. ใช้ named Exports
อย่าใช้ default exports การ Import Modules ต้องตั้งชื่อให้กับค่าเหล่านั้น ซึ่งอาจนำไปสู่ความไม่สอดคล้องกันในการตั้งชื่อ ระหว่าง Modules
ไม่แนะนำ:
แนะนำ:
16. ไม่ควรใช้ Wildcard Imports
สิ่งนี้จะช่วยทำให้แน่ใจว่า คุณมี default export เพียงรายการเดียว
ไม่แนะนำ:
แนะนำ:
17. ใช้ Shortcuts สำหรับ Booleans
ไม่แนะนำ:
แนะนำ:
18. หลีกเลี่ยงการใช้ Ternary Statements ที่ไม่จำเป็น
ไม่แนะนำ:
แนะนำ:
19. ใช้เพียง 1 ตัวแปร ต่อการประกาศตัวแปรแต่ละครั้ง
สิ่งนี้อาจทำให้คุณรู้สึกไม่เห็นด้วยอีกครั้ง แต่การประกาศตัวแปรมากกว่า 1 ตัว อาจทำให้เกิดข้อผิดพลาดได้ในบางกรณี
ไม่แนะนำ:
แนะนำ:
สรุป
Coding Standards ในแต่ละภาษา สามารถช่วยในเรื่องความสามารถในการอ่าน/ทำความเข้าใจและการ Maintain Application สิ่งหนึ่งที่อาจยุ่งยากหากคุณทำงานเป็นทีมก็คือ การพยายามทำให้ทุกคนทำตาม Coding Standards ที่ตั้งไว้ แนวคิดบางอย่างที่อาจช่วยได้มีดังนี้:
- การ Review Code โดยดู Code ไปทีละบรรทัด
- ใช้การ Linting หรือ Code Analyzers
- การสร้าง Application ที่สอดคล้องกัน เพื่อที่ Developer ทุกคนจะได้ทราบว่า ต้องสร้างหรือ Update อะไรบ้าง
- เมื่อคุณสร้างอะไรใหม่ขึ้นมา ก็ควรให้ Senior Developer สักคนมาช่วยมาดู เนื่องจาก Developer คนอื่นจะสามารถใช้ Code นั้นเป็นแนวทางได้
ที่มา: https://medium.com/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
|
|
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
|
|
บทความล่าสุด