JavaScript အခြေခံ အပိုင်း (၁)

JavaScript သမိုင်းကြောင်း

                JavaScript ကို ၁၉၉၅ ခုနှစ်မှ စတင်ခဲ့တယ်လို့ ဆိုပါတယ်။ အဓိက ရည်ရွယ်ချက်အနေနဲ့ Website တွေကို HTML & CSS တွေနဲ့ပေါင်းပြီး ပိုမိုအသက်ဝင်လာအောင် ဖန်တီးနိုင်ဖို့ ရည်ရွယ်ခဲ့ပါတယ်။ JavaScript ဆိုတဲ့ Trademark က Oracle Corporation က ပိုင်ဆိုင်ပြီး Netscape Communication က ဖန်တီးခဲ့ပါတယ်။ Netscape Communication ဟာ အခုအချိန်မှာတော့ Mozilla Foundation အနေနဲ့ ဆက်လက်လည်ပတ်နေပါတယ်။

                JavaScript ကို စနစ်သတ်မှတ်မှုအနေနဲ့ ဆောင်ရွက်နိုင်ဖို့ ၁၉၉၆ ခုနှစ်မှာ ECMA International (Europen Computer Manufacture Association) ကို ပေးပို့ခဲ့ပြီး စနစ်သတ်မှတ်ချက်အနေနဲ့ ECMAScript ရဲ့ ပထမဦးဆုံး ထုတ်ပြန်ချက်ဖြစ်တဲ့ ECMA-262 First Edition ကို ၁၉၉၇ခုနှစ်၊ ဇွန်လမှာ စတင်ထုတ်ပြန်ခဲ့ပါတယ်။ လောလောလတ်လတ် ထုတ်ပြန်ချက်အနေနဲ့ ၂၀၁၇ ခုနှစ်၊ ဇွန်လမှာ ECMAScript Eight Edition ကို ထုတ်ပြန်ထားပါတယ်။ 

JavaScript ကို ဘယ်လို စလေ့လာမလဲ?

                JavaScript ကို စတင်လေ့လာသူတွေအနေနဲ့ JavaScript ကို Java Programming Language နဲ့ အမှတ်မှား၊ ရောထွေးတတ်ကြပါတယ်။ တကယ်တော့ JavaScript ဟာ Java ဆိုတဲ့ နာမည်ကို ယူထားပေမယ့် Java နဲ့ ဘာမှ မဆိုင်ပါဘူး။ World Wide Web လို့ ခေါ်တဲ့ နည်းပညာမှာ JavaScript ဟာ အဓိကကျတဲ့ အခန်းကဏ္ဍမှာ ပါဝင်ပါတယ်။

 

                ကျွန်တော်တို့ Website တစ်ခုကို တည်ဆောက်ကြတဲ့အခါ အစိတ်အပိုင်း (၃)ခုနဲ့ တည်ဆောက်ကြပါတယ်။ 

  1. စာသား၊ ဓာတ်ပုံ၊ ဗီဒီယို စသည်ဖြင့် Content တွေကို ထည့်သွင်းဖော်ပြချင်တဲ့အခါ HTML ကို အသုံးပြုကြပါတယ်။ ဒါပေမယ့် HTML ရိုးရိုးအနေနဲ့ ပုံစံကျ လှပအောင် မလုပ်ပေးနိုင်ပါဘူး။ Content တွေ ပါဝင်လာအောင်သာ လုပ်ဆောင်နိုင်ပါတယ်။
  2. HTML မှာ ထည့်သွင်းထားတဲ့ Content တွေကို ပုံစံတကျ၊ နေရာတကျ၊ ကြည့်လို့လွယ်အောင်၊ လှပအောင် ပြုလုပ်ဖန်တီးပေးသူကတော့ CSS ဖြစ်ပါတယ်။ CSS အနေနဲ့ Presentation ကို တာဝန်ယူပေးပါတယ်။ ဒါပေမယ့် CSS အနေနဲ့ Website ကို အသက်ဝင် လှုပ်ရှားလာအောင် မလုပ်နိုင်ပါဘူး။ (ဒါပေမယ့် CSS3 မှာဆိုရင်တော့ သက်ဝင်လှုပ်ရှားမှု Behavior တွေကို အတိုင်းအတာတစ်ခုအထိ လုပ်ဆောင်လာနိုင်ပါတယ်)
  3. HTML မှာ ထည့်သွင်းထားတဲ့ Content တွေလဲ ပြည့်စုံပြီ၊ CSS ကိုသုံးပြီး Presentation လှအောင် နေရာတကျ စီစဉ်ပြီးသွားပြီဆိုရင်တော့ သက်ဝင်လှုပ်ရှားမှုအတွက် JavaScript ကို အသုံးပြုဖို့ လိုအပ်လာပါတယ်။ (ဥပမာ တစ်ခုအနေနဲ့ ကိုယ့် Website ထဲမှာ Slider တစ်ခု ထည့်သွင်းချင်တယ်ဆိုရင် HTML, CSS နဲ့တင် မလုံလောက်တော့ပါဘူး။ JavaScript ရဲ့ အကူအညီကို ရယူရတော့မှာ ဖြစ်ပါတယ်) 

                အဲဒီလို အဆင့်ဆင့်တည်ဆောက်လာရင်းနဲ့ပဲ JavaScript အဆင့်ကို ရောက်တဲ့အခါမှာတော့ ကျွန်တော်တို့ Website ဟာ အသုံးပြုသူတွေအတွက် အဆင်ပြေလွယ်ကူမှုကို ပေးစွမ်းနိုင်မှာ ဖြစ်ပါတယ်။


                ကျွန်တော်တို့ Web Development ကို လေ့လာမယ့်သူတွေအနေနဲ့ မဖြစ်မနေ သတိထားဖို့လိုမယ့် အချက်တစ်ခုရှိပါတယ်။ အဲဒါကတော့ အပေါ်ကပုံမှာပြထားတဲ့ Learning Curve ဖြစ်ပါတယ်။ HTML, CSS တွေကို လေ့လာတဲ့အခါမှာ စနစ်တကျ သင်ယူမယ်ဆိုရင် အခက်အခဲ သိပ်မရှိပေမယ့် JavaScript ကို လေ့လာတဲ့အခါမှာတော့ HTML & CSS ကို လေ့လာတာနဲ့ ဘာမှမဆိုင်တော့ပဲ ရုတ်တရက် မြင့်တက်သွားပါတယ်။ လေ့လာရ ခက်ခဲသွားပါတယ်။

                အဲဒီအပြင် JavaScript ဆိုတာ Browser မှာ Ready-Made ပါတဲ့ဟာအပြင်၊ Server-Sided JavaScript တွေလဲ ရှိပါတယ်။ အဲဒီအပြင် Ajax လို့ခေါ်တဲ့ Webpage ကို Refresh လုပ်စရာမလိုပဲ အချက်အလက် ရယူနိုင်တဲ့ စနစ်တွေအတွက်လဲ အသုံးဝင်တာ ဖြစ်တဲ့အတွက် ခက်ခဲမှုအတိုင်းအတာက မိမိရဲ့အသုံးချမှုအပေါ်မှာ မူတည်ပြီး ကွဲပြားခြားနားမှာ ဖြစ်ပါတယ်။ 

                အဓိကအချက်ကတော့ HTML&CSS ကို လေ့လာပြီး JavaScript ကို လေ့လာတော့မယ်ဆိုရင် HTML & CSS လို လွယ်မယ်ထင်ပြီး မပေါ့ဖို့ပါ။

                နောက်ထပ် အရေးကြီးတစ်ခုက HTML & CSS အနေနဲ့ Scripting Language အနေနဲ့ပဲရှိပါတယ်။ အဆင့်မြင့် Programming Language တွေ မဟုတ်ပါဘူး။ ဒါပေမယ့် JavaScript ဟာ High Level Programming Language တစ်ခုဖြစ်တဲ့ အပြင် Object-Oriented, Prototype စတဲ့ Language Feature တွေကို အထောက်အပံ့ပေးတာ ဖြစ်တဲ့အတွက် HTML & CSS သိတာလောက်နဲ့ JavaScript ကို သိမယ်လို့ ယူဆလို့မရပါဘူး။ 

                JavaScript ကို လေ့လာမယ်ဆိုရင် Programming Fundamental ဆိုင်ရာ အတွေးအခေါ်ပိုင်းတွေကို အရင်ဆုံး ကျေညက်အောင် လုပ်ထားဖို့ လိုအပ်မှာဖြစ်ပါတယ်။ အဲဒီအတွက် Programming Fundamental အပိုင်းတွေကို လေ့လာနိုင်စေဖို့ SaturnGod (ကိုထိန်လင်းရွှေ) ရေးထားတဲ့ Programming for Beginner ကို ဖတ်ဖို့၊ လိုက်လုပ်ကြည့်ဖို့၊ ညွှန်းလိုပါတယ်။

JavaScript လေ့လာဖို့ Development Environment ဘယ်လို တည်ဆောက်မလဲ?

                JavaScript ကို လေ့လာဖို့ အကြမ်းအားဖြင့် Browser နဲ့ Code Editor တစ်ခု လိုအပ်ပါတယ်။ Browser အနေနဲ့ဆိုရင် အကောင်းဆုံးက အားလုံးနီးပါး ကိုယ့်စက်ထဲမှာရှိတာ ကောင်းပါတယ်။ Windows သုံးမယ်ဆိုရင် Internet Explorer, Firefox, Chrome, Opera စသည်ဖြင့် အစုံထည့်ထားသင့်ပါတယ်။ 

                အဲဒီလို ထည့်သွင်းထားမှသာ ကိုယ့်ရေးလိုက်တဲ့ကုဒ်ဟာ Browser အားလုံးမှာ အလုပ် လုပ်၊ မလုပ် စမ်းသပ်နိုင်မှာ ဖြစ်ပါတယ်။ ကျွန်တော်ကတော့ ဒီသင်ခန်းစာတွေမှာ Chrome နဲ့ Firefox ကိုသာ အဓိကထား သုံးပြသွားမှာ ဖြစ်ပါတယ်။ (Chrome မှာတော့ ဘာမှ ထပ်ဖြည့်စရာ မလိုပါဘူး။ Firefox မှာတော့ ထပ်ဖြည့်စရာတွေရှိပါတယ်)


                အပေါ်ကပုံမှာ ပြထားတဲ့ FireBug ဆိုတဲ့ Extension ကို ထည့်သွင်းထားဖို့ လိုအပ်မှာ ဖြစ်ပါတယ်။ Firefox က Search Box က တစ်ဆင့် Firebug ဆိုပြီးရှာလိုက်ရင် အလွယ်တကူ တွေ့နိုင်ပါတယ်။ အဲဒီလို Install လုပ်လိုက်ရင် ... 


                Firebug ဆိုတဲ့ Icon လေး တွေ့ရမှာ ဖြစ်သလို ကလစ်ခေါက်လိုက်မယ်ဆိုရင် Browser အောက်ဖက်မှာ Console, HTML, CSS စသည်ဖြင့် တွေ့နိုင်တဲ့ Box တွေ ထွက်လာပါလိမ့်မယ်။ Chrome မှာဆိုရင်တော့ အောက်ကပုံမှာ ပြထားသလိုပဲ Browser အတွင်းမှာတင်ပဲ Right Click ခေါက်၊ Inspect ကို ဖွင့်ပြီး Firebox က Firebug ပုံစံမျိုးကို ဖွင့်နိုင်ပါတယ်။


                ကျွန်တော်တို့ Browser နှစ်ခု ထည့်သွင်းပြီးပြီဆိုရင်တော့ JavaScript ကို ရေးနိုင်ဖို့အတွက် Code Editor  တစ်ခုလိုအပ်မှာ ဖြစ်ပါတယ်။ JavaScript ရေးဖို့အတွက် ကျွန်တော် အကြိုက်ဆုံးကတော့ Visual Studio Code ပါပဲ။  OS အားလုံးကို Support ပေးပါတယ်။ https://code.visualstudio.com/ ကတစ်ဆင့် Download ရယူနိုင်ပါတယ်။  

                Visual Studio Code အသုံးပြုပြီး JavaScript ရေးသားတဲ့ ပုံစံကိုတော့ အောက်က ScreenCast မှာ ကြည့်နိုင်ပါတယ်။


Part-2