Writing Clean JavaScript

Code ရေးတယ်ဆိုတာ ကွန်ပျူတာ အလုပ်လုပ်ဖို့ နားလည်အောင် ရေးရုံ သက်သက် မဟုတ်ပါဘူး။ လူ (ကိုယ့်ကိုယ်တိုင် ပြန်ဖတ်တဲ့အခါပဲ ဖြစ်ဖြစ်၊ တခြား Developer တွေ ဝင်ဖတ်တဲ့အခါပဲ ဖြစ်ဖြစ်) လွယ်လွယ်ကူကူ ဖတ်ရှု နားလည်နိုင်ဖို့ (Readable) ဖြစ်ဖို့ကလည်း အလွန်ကို အရေးကြီးပါတယ်။

၁။ Naming Conventions (နာမည် ပေးခြင်း အနုပညာ)

Variable တွေ၊ Function တွေ နာမည်ပေးတဲ့အခါ ဘာအတွက် သုံးထားသလဲ ဆိုတာကို ချက်ချင်း သိနိုင်မယ့် အဓိပ္ပာယ်ရှိတဲ့ နာမည် (Meaningful Name) ကို ပေးရပါမယ်။ JavaScript မှာ CamelCase (ပထမ စာလုံး အသေး၊ ဒုတိယ စာလုံးကစပြီး အစစာလုံး အကြီး ရေးနည်း) ကို အသုံးပြုတာက စံသတ်မှတ်ချက် (Standard) တစ်ခု ဖြစ်ပါတယ်။

• ❌ let x = 10; (ဒီ x က ဘာအတွက် သုံးထားတဲ့ ၁၀ လဲ ဆိုတာ ဘယ်သူမှ မသိနိုင်ပါဘူး)
• ✅ let studentAge = 10; (ရှင်းလင်းပြီး တိကျပါတယ်)
• ❌ function abc() {} (ဘာလုပ်တဲ့ Function လဲ ဆိုတာ မသိရပါဘူး)
• ✅ function calculateTax() {} (အခွန် တွက်ချက်မယ့် Function ဆိုတာ ချက်ချင်း သိသာပါတယ်)

၂။ Comments (မှတ်ချက် ရေးသားခြင်း)

Code တွေက ဘာလုပ်တာလဲ ဆိုတာကို အခြားသူတွေ နားလည်အောင် ရှင်းပြထားသင့်ပါတယ်။ ဒါပေမဲ့ တကယ့်ကို လိုအပ်တဲ့ နေရာ (ရှုပ်ထွေးတဲ့ Logic တွေ) မျိုးမှာသာ ရေးသင့်ပါတယ်။ Code က သူ့ဟာသူ ရှင်းလင်းနေပြီးသား ဆိုရင် Comment တွေ အများကြီး လိုက်ရေးနေစရာ မလိုပါဘူး။

// 🟢 Good Comment: ဘာကြောင့် ဒီလို နည်းလမ်းကို ရွေးချယ် ရေးသားရသလဲ ဆိုတာကို ရှင်းပြထားခြင်း
// We use 3.14 instead of Math.PI because simpler precision is enough for this basic calculation.
const pi = 3.14;

// 🔴 Bad Comment: Code ဖတ်တာနဲ့တင် ချက်ချင်း သိနိုင်တဲ့ အရာတွေကို အပို လိုက်ပြောနေခြင်း
let age = 20; // set age variable to 20 (လုံးဝ မလိုအပ်ပါ)

၃။ Formatting (သပ်ရပ်စွာ နေရာချထားခြင်း)

တွန့်ကွင်း {} တွေ ဖွင့်တာ ပိတ်တာ၊ Code တွေကို Tab ခံပြီး နေရာခြားတာ (Indentation) တွေကို စနစ်တကျနဲ့ သပ်ရပ်အောင် ထားရှိရပါမယ်။ စာကြောင်း တစ်ကြောင်းတည်းမှာ Code တွေ အရှည်ကြီး ပြွတ်သိပ် ရေးတာမျိုးကို ရှောင်ကြဉ်ပါ။ Code Editor (VS Code) မှာ Prettier လိုမျိုး Code Formatter Extension တွေကို သွင်းထားပြီး အသုံးပြုရင် Code တွေကို အလိုအလျောက် သပ်သပ်ရပ်ရပ် ဖြစ်အောင် စီစဉ်ပေးသွားပါလိမ့်မယ်။

၄။ Don’t Repeat Yourself (DRY Principle)

တူညီတဲ့ Code တွေကို နေရာအနှံ့မှာ ထပ်ခါထပ်ခါ (Copy/Paste လုပ်ပြီး) ရေးနေရပြီ ဆိုရင်၊ အဲ့ဒီ Code တွေကို သီးသန့် Function တစ်ခု အနေနဲ့ ခွဲထုတ်လိုက်ပါ။ အဲ့ဒီလို လုပ်ခြင်းအားဖြင့် နောက်ပိုင်း Code ပြင်တဲ့အခါ တစ်နေရာတည်း ပြင်လိုက်တာနဲ့ အကုန်လုံး လိုက်ပြောင်းသွားမှာ ဖြစ်တဲ့အတွက် အချိန်ကုန် သက်သာပြီး၊ အမှားပါဝင်မှု (Bug) လည်း သိသိသာသာ လျော့ကျသွားပါလိမ့်မယ်။