COOL IT IDEAS AND STUFF
Variable Naming Best Practices in JavaScript
06-Nov-24
คัมภีร์เทพ IT
See the original english version Click here!
การเขียน JavaScript ให้มี Structure ชัดเจนและเข้าใจง่ายนั้น ถือเป็นสิ่งสำคัญไม่ต่างจากภาษา Programming อื่น ๆ หนึ่งในส่วนประกอบพื้นฐานของ JavaScript Code ที่ Clean ก็คือ การตั้งชื่อตัวแปรอย่างมีประสิทธิภาพ ซึ่งบทความนี้จะมาแนะนำ 12 Best Practices เกี่ยวกับการตั้งชื่อตัวแปรใน JavaScript
1. หลีกเลี่ยงการใช้ var ในทุกสถานการณ์
ก่อนจะมี ES6 การใช้ var ถือเป็นวิธีหลักในการประกาศตัวแปร แต่ว่า var ก็มีข้อจำกัดบางอย่างที่อาจนำไปสู่ผลลัพธ์ที่ไม่คาดคิด ซึ่งทำให้เกิดความยุ่งยากในการ Debug
สำหรับใน JavaScript ในปัจจุบัน เรามักหลีกเลี่ยงการใช้ var แล้วหันมาใช้ let กับ const แทนได้ เนื่องจากจะช่วยให้มีพฤติกรรมที่คาดการณ์ได้ง่ายกว่าและมี Scope ของตัวแปรที่จำกัดอยู่ใน Block Code ซึ่งทำให้ Code อ่านง่ายและ Maintain Code ได้สะดวกขึ้น
2. let: ตัวแปรที่สามารถเปลี่ยนค่าได้
ใช้ let เพื่อประกาศตัวแปรที่คุณอาจจะต้องเปลี่ยนค่าใน Code ของคุณในภายหลัง
3. const: ค่าคงที่สำหรับค่าที่ไม่เปลี่ยนแปลง
กรณีที่คุณ มีค่าที่ไม่ต้องมีการเปลี่ยนแปลงตลอดทั้ง Program แนะนำให้ใช้ const
กฎง่าย ๆ ก็คือ ใช้ const เป็นค่า Default และใช้ let ก็ต่อเมื่อ คุณรู้ว่า ในอนาคตจะต้องมีการเปลี่ยนค่าในตัวแปรนั้น
4. ความชัดเจนและคำอธิบายที่เข้าใจง่าย
จุดประสงค์หลักของการตั้งชื่อตัวแปรก็คือ จะต้องสื่อถึงหน้าที่และเนื้อหาของตัวแปรเหล่านั้นได้ชัดเจน ขอแนะนำให้เลือกใช้ ชื่อที่สามารถเข้าใจได้ง่ายและสะท้อนถึงข้อมูลที่เก็บได้อย่างถูกต้อง
แนะนำ: firstName, totalPrice, productDescription
ไม่แนะนำ: x, a, temp
5. ใช้คำที่มีความหมาย
หลีกเลี่ยงการใช้ตัวย่อหรือคำศัพท์ทางเทคนิคที่ซับซ้อนเกินไป เพราะมันอาจทำให้ Developers คนอื่น ๆ ที่ต้องทำงานร่วมกันกับคุณรู้สึกสับสนได้
แนะนำ: customerName, orderStatus, employeeRecord
ไม่แนะนำ: custNm, ordSt, empRec
6. Camel Case Convention
ข้อตกลงการตั้งชื่อตัวแปร ที่นิยมใช้งานกันมากที่สุดอย่างหนึ่งในการตั้งชื่อตัวแปรใน JavaScript ก็คือ การใช้ Camel Case
แนะนำ: fullName, dateOfBirth, shippingAddress
ไม่แนะนำ: full_name, dateofbirth, shipping_address
7. ใช้ตัวอักษรพิมพ์ใหญ่ (Upper Case) สำหรับค่าคงที่
หากคุณมีตัวแปรที่เก็บค่าคงที่และไม่มีการเปลี่ยนแปลงค่าในภายหลัง ขอแนะนำให้ประกาศตัวแปรให้เป็นตัวพิมพ์ใหญ่ทั้งหมดและใช้ขีดล่างเพื่อแยกคำ
แนะนำ: TAX_RATE, API_KEY, MAX_ATTEMPTS
ไม่แนะนำ: taxRate, apiKey, maxAttempts
8. หลีกเลี่ยงการใช้ตัวแปรที่เป็นตัวอักษรเพียงตัวเดียว
แม้ว่า การใช้ตัวแปรที่เป็นตัวอักษรเพียงตัวเดียว จะน่าใช้ในการวน Loop อย่างรวดเร็ว แต่โดยทั่วไปแล้ว ตัวแปรเหล่านั้นจะทำให้ Code อ่านยากขึ้น
แนะนำ: counter, index, sum
ไม่แนะนำ (ยกเว้นในบางกรณี): i, j, k
9. ใช้คำที่เป็นพหูพจน์สำหรับ Arrays
ถ้าตัวแปรของคุณเป็น Array ขอแนะนำให้ใช้ชื่อตัวแปรที่เป็นพหูพจน์ เพื่อสื่อว่า มันสามารถเก็บได้หลาย Elements
แนะนำ: productNames, orderItems, employeeList
ไม่แนะนำ: productName, orderItem, employee
10. ใช้คำนำหน้าใน Boolean Variables
สำหรับตัวแปรที่เป็น Boolean ขอแนะนำให้ใช้คำนำหน้า เช่น is, has, หรือ can เพื่อให้เห็นจุดประสงค์ที่ชัดเจนของตัวแปรเหล่านั้น
แนะนำ: isActive, hasDiscount, canEdit, isLoggedIn
ไม่แนะนำ: active, discountApplied, editEnabled, loggedIn
11. ตั้งชื่อตาม Scope ที่ใช้งาน
หากคุณต้องทำงานกับตัวแปรที่อยู่ภายใน Scope ที่เฉพาะเจาะจง ขอให้พิจารณาใช้คำนำหน้าหรือคำต่อท้ายที่สื่อถึง Scope นั้น ๆ
แนะนำ: globalCounter, localIndex, moduleSpecificConfig
ไม่แนะนำ: counter, index, config
12. ประกาศตัวแปรให้แยกกัน
การประกาศตัวแปรแต่ละตัวแบบแยกบรรทัดกัน ถือเป็นแนวทางปฏิบัติที่ดี เพื่อช่วยให้อ่าน Code ได้ง่ายและเข้าใจได้ดีขึ้น
แนะนำ:
let isActive = false;
let canEdit = true;
ไม่แนะนำ: let isActive = false, canEdit = true;
และนี่ก็เป็น 12 Best Practices เกี่ยวกับการตั้งชื่อตัวแปรใน JavaScript ที่คุณสามารถนำไปประยุกต์ใช้งานได้ ซึ่งการมีข้อตกลงในการตั้งชื่อตัวแปรที่จะใช้ภายใน Project ของคุณและยึดมั่นในข้อตกลงนั้น จะทำให้ Code ของคุณเป็นระเบียบและที่สำคัญคือ มันจะช่วยคุณจะสามารถสร้าง Code ที่ Clean และ Maintain ได้ง่าย ซึ่งเป็นประโยชน์ทั้งกับตัวคุณเองและทีม Development ของคุณ
ที่มา: https://javascript.plainenglish.io/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
|
|
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
|
|
บทความล่าสุด