บทความ IT เจ๋งๆ
10 เคล็ดลับ การเขียน JavaScript Code ให้ Clean ยิ่งขึ้น
10-ส.ค.-22
คัมภีร์เทพ IT
ปัจจุบัน JavaScript ได้รับความนิยมอย่างมาก และด้วยการเปิดตัว Frameworks ต่าง ๆ ในช่วงหลายปีที่ผ่านมา มีความครอบคลุมทั้ง Backend และ Frontend Web ยิ่งทำให้ได้รับความนิยมอย่างต่อเนื่อง ดังนั้นการเขียน JavaScript Code ให้ Clean และอ่านเข้าใจง่ายจึงเป็นสิ่งจำเป็น บทความจึงมาแนะนำ 10 เคล็ดลับ การเขียน JavaScript Code ให้ Clean ยิ่งขึ้น
1. ตั้งชื่อตัวแปรให้อ่านแล้วเข้าใจ
ชื่อตัวแปรของคุณ ควรจะสามารถอธิบายวัตถุประสงค์ของมันได้อย่างชัดเจน หลีกเลี่ยงการใช้คำที่อ่านแล้วเข้าใจยาก เคล็ดลับเล็ก ๆ น้อย ๆ อีกหนึ่งเรื่องก็คือ ให้ลองใช้ Case ที่เหมาะสม อย่าง camel case
ลองดูตัวอย่างด้านล่างนี้
2. ตั้งชื่อตัวแปรให้สามารถ Search ได้ง่าย
แม้ว่าในบางบทความจะบอกคุณว่า อย่าสร้างตัวแปรเมื่อคุณสามารถใช้ Monomorphic Forms ได้ ซึ่งเราไม่ควรจะขยายสิ่งนี้เพื่อใช้ Constants เพราะจะทำให้ Code อ่านและ Search ยากขึ้น ซึ่งแนวคิดที่เหมาสมก็คือ การเก็บพวกมันไว้ในตัวแปร const และใช้ CONSTANT_CASE ในการตั้งชื่อตัวแปร
สามารถดูตัวอย่างได้ดังนี้:
3. หลีกเลี่ยงการใช้ตัวแปรที่ต้องคาดเดาว่ามันคืออะไร
เป็นการดีที่จะตั้งชื่อตัวแปรอย่างชัดเจนภายใน array.forEach() แทนที่จะใช้ตัวย่อที่ไม่สื่อความหมายใด ๆ ซึ่งแน่นอนว่ามันอาจสร้างปัญหาในภายหลัง
4. หลีกเลี่ยงสิ่งที่ไม่จำเป็น
หากชื่อ Class หรือ Object บ่งบอกคุณอยู่แล้วว่า พวกมันย่อมาจากอะไร ก็จงอย่าเพิ่มข้อมูลนั้นลงในชื่อตัวแปรของคุณอีก จากตัวอย่างด้านล่างนี้ เนื่องจากเราทราบอยู่แล้วว่า เรากำลังพูดถึง Car หรือ paintCar คุณไม่จำเป็นต้องกล่าวถึงคำว่า car ซ้ำลงไปอีกในตัวแปรของคุณ
5. ใช้ Default Arguments ใน Functions ของคุณ
หลีกเลี่ยงการใช้ Short-Circuiting หรือ Conditionals ใน Functions ของคุณเพื่อทำให้ Code ของคุณ Clean ที่สำคัญกว่านั้นคือ จงจำไว้ว่าเฉพาะ Undefined Arguments เท่านั้น ที่จะได้รับค่าโดย Function ของคุณ Default Values จะไม่แทนที่ Falsy Values อื่น ๆ
6. ใช้ Default Arguments อย่างชาญฉลาด
ตามกฎทั่วไป ให้พยายามจำกัดจำนวน Arguments ของ Function ไว้ที่ 2 หรือสูงสุด 3 Arguments หากมีการรับ Arguments เป็นจำนวนมาก ก็อาจมีความเป็นไปได้ที่ Function ของคุณอาจทำหลายสิ่งมากเกินไป อย่างไรก็ตาม หากคุณยังต้องการใช้หลาย Arguments ก็ขอแนะนำให้ใช้ JavaScript Object เป็น Argument เพื่อให้เกิดความชัดเจนว่ามี Properties ใดบ้างที่ Function ต้องการ คุณสามารถใช้ ES6 Destructuring Syntax ได้
7. แต่ละ Functions ควรทำหน้าที่เพียงอย่างเดียว
อย่าลืมว่า Functions ใดมีไว้เพื่อทำอะไร นั่นคือพยายามทำ Code ของคุณให้เป็น Module และพยายามทำ Function มีขนาดเล็กลงเพื่อให้มันทำหน้าที่อย่างใดอย่างหนึ่งเพียงครั้งเดียว สิ่งนี้จะช่วยให้มั่นใจได้ว่า Code ของคุณนั้นง่ายต่อการเขียน, Test และทำความเข้าใจ และอย่าตั้งวัตถุประสงค์หลาย ๆ อย่างภายใน Function เดียว
8. ตั้งชื่อ Functions ให้อ่านแล้วเข้าใจ
ตรวจสอบให้แน่ใจว่าคุณเขียน Functions ด้วยชื่อที่สามารถเข้าใจได้อย่างชัดเจนว่า Functions นั้นใช้ทำอะไร การตั้งชื่อ Function ที่มีความคลุมเครือ จะทำให้คนที่มาอ่าน Code จะต้องดูคำ Definition และ Logic ของ Function เพื่อทำความเข้าใจงานของพวกเขา ซึ่งเป็นการใช้เวลาเพิ่มขึ้นไปอีก
9. หลีกเลี่ยงการใช้ Code ที่ซ้ำซ้อนกัน — ทำให้มันสั้นลงและ Clean ขึ้น
สิ่งที่น่าเจ็บปวดที่สุดก็คือ มีการใช้งาน Code แบบเดียวซ้ำ ๆ กันในหลาย ๆ Sections ของ Code เราทุกคนคงจะเคยเจอเหตุการณ์เช่นนี้ ซึ่งมักจะเกิดขึ้นเนื่องจาก Logic บางอย่างมีการใช้งานแตกต่างกันเพียงเล็กน้อยใน 2 แห่งขึ้นไป แต่อย่างไรก็ตาม ลองนึกถึงฝันร้ายที่ใครบางคนอาจต้องเจอ หากพวกเขาพบ Bug ใน Logic และพวกเขาจำเป็นต้องแก้ไขสิ่งนี้ในทุก ๆ Sections ของ Code
10. ไม่ควรใช้ Flags เป็น Function Parameters
ทำไมคุณถึงต้องใช้ Flags เป็น Function Parameters? ด้วยเหตุผลที่ชัดเจนเพียงอย่างเดียว คือ Function ของคุณกำลังทำหลายหน้าที่ และจากข้อ 7 คุณคงจะรู้แล้วว่า นั่นเป็นแนวทางปฏิบัติที่ไม่ค่อยดีนัก ดังนั้น ขอแนะนำให้แบ่ง Function ของคุณออกเป็น 2 Functions แทน จะดีกว่า
อันที่จริง เคล็ดลับโดยส่วนใหญ่ข้างต้น ก็สามารถนำไปประยุกต์ใช้ได้กับหลาย ๆ ภาษา Programming ไม่ใช่แค่เพียง JavaScript เท่านั้น และนี่เป็นเพียงเคล็ดลับส่วนหนึ่ง และยังมีเคล็ดลับอื่น ๆ อีกมากมาย หากคุณฝึกฝนเขียน Code ให้ Clean อยู่เสมอ ก็จะช่วยทำให้คุณ (หรือ Developer คนอื่น) ไม่ต้องมาปวดหัวกับมันอีกครั้งในอนาคต
ที่มา: https://medium.com/
รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert
|
|
อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ
|
|
บทความล่าสุด