Hello guys!
ဒီ Blogလေးမှာ JavaScript ရဲ့ Higher-order functions တွေအကြောင်းကို Part-1 အနေနဲ့ဆွေးနွေးသွားမှာ ဖြစ်ပါတယ်။
Higher-order functions ဆိုတာကြီးက အခေါ်အဝေါ်အကြောင့် ကြီးကျယ်သလိုခံစားရလိမ့်ပါမယ်။ တကယ်တော့ JavaScript ကိုရေးဖူးတဲ့သူတိုင်း တွေ့ဖူး သုံးဖူးနေကြ functions တွေပါပဲ။ အခုကျွန်တော်တို့ ရိုးရိုးသုံးနေကျ codeရေးသားပုံစံနဲ့ higher-order functions တွေအသုံးပြုပြီးရေးပုံနဲ့ ကွာခြားပုံကို အဓိကထားပြီးနားလည်လွယ်ကူအောင် ဆွေးနွေးသွားပါမယ်။
Example လေးတွေနဲ့ ကျွန်တော်တို့သွားကြည့်ရအောင်..
let numbers = [1,2,3,4,5];
for(let i=0; i<numbers.length; i++){
console.log(numbers[i]);
}
အပေါ်က codeရဲ့ရေးသားပုံက numbers ဆိုတဲ့ array တစ်ခုကို for loop ပတ်ပြီး array value တွေကို ထုတ်ထားတာပါ။ ဒီလိုပုံစံကို higher-order function တစ်ခုဖြစ်တဲ့ foreach နဲ့အသုံးပြုပြီးလဲ အခုလိုအောက်ကအတိုင်းထုတ်လို့ရပါတယ်။
numbers.forEach(function(num){
console.log(num);
});
အပေါ်က codeကတော့ JavaScript ရဲ့ built-in higher-order function တစ်ခုဖြစ်တဲ့ forEach ကိုအသုံးပြုပြီးရေးထားတာပါ။ for loop နဲ့ တူညီတဲ့ result ပဲ ထွက်မှာဖြစ်တဲ့အပြင် code လဲအရမ်းမရှည်တော့ပါဘူး။ code ကို ထပ်ပြီး reduce လုပ်ချင်ရင် ES6 syntax တွေဖြစ်တဲ့ arrow functions, template strings စတာတွေနဲ့ မွမ်းမံလို့လဲရပါတယ်။ တစ်ချက်ရေးကြည့်ရအောင်..
numbers.forEach(num => console.log(num));
အပေါ်ကလို တစ်ကြောင်းထဲနဲ့ တူညီတဲ့အဖြေထွက်တာတွေ့ရမှာပါ။
အဲ့တာဆို နောက် Higher-order function တစ်ခုဆက်သွားပါမယ်။
let newArray = [];
for(let i=0; i<numbers.length; i++){
if(numbers[i] === 3){
newArray.push(numbers[i]);
}
}
console.log(newArray);
ဒီ code example မှာတော့ numbers array ထဲက number 3 value ကိုသာရွေးထုတ်ပြီး အသစ်ဆောက်ထားတဲ့ newArray ဆိုတဲ့ array ထဲကိုထည့်ထားပါတယ်။ code အရ အလုပ်လုပ်တယ်..ဒါပေမဲ့ ကျွန်တော်တို့က ဒီအဖြေကိုရဖို့ပဲ Higher-order function တစ်ခုဖြစ်တဲ့ filter function ကိုအသုံးပြုသွားပါမယ်။
let newArray = numbers.filter(function(num){
if(num === 3) return true;
});
console.log(newArray);
အပေါ်ကcodeရေးသားပုံကတော့ built-in higher-order function ဖြစ်တဲ့ filter ကိုအသုံးပြုထားပါတယ်။ ထူးခြားတာက filter function က return true or false ပြန်ပေးပြီး true value ကို new filtered array တစ်ခုထဲထည့်ပြီးပြန်ထုတ်ပေးတာပါပဲ။ အပေါ်က code အရ number 3 ဖြစ်တဲ့နံပါတ်ဖြစ်ရင် သူ့ကို filtered array အသစ်တစ်ခုထဲထည့်ပေးထားလိုက်တာပါပဲ။ အားသာချက်ကတော့ array ကို filter လုပ်ဖို့ဖန်တီးပေးထားတဲ့အပေါ်အသုံးပြုထားတာဖြစ်လို့ မိမိရေးသားတဲ့ code ရည်ရွယ်ချက်နဲ့ကျစ်လစ်မှုကိုပေါ်လွင်စေမှာလဲဖြစ်ပါတယ်။
JavaScript ES6 syntax ကိုအသုံးပြုပြီး filter ကို ပြန်ပြင်ရေးကြည့်မယ်။
let newArray = numbers.filter(num => num === 3 );
console.log(newArray);
ဒီလိုဆိုရင်လဲ ကျွန်တော်တို့ တူညီတဲ့အဖြေကို code အနည်းငယ်နဲ့ ကျစ်လစ်စွာရရှိမှာပါ။
Congratulations!
ဒီနေ့အတွက် JavaScript Higher-order functions ထဲက foreach နဲ့ filter ကို ကျွန်တော်တို့ဆွေးနွေးခဲ့ပါတယ်။ နောက် Blogမှာ ကျန်ရှိနေတဲ့ functions တွေကိုဆက်လက်ဆွေးနွေးသွားပါမယ်။ ဖတ်ရှုပေးတဲ့အတွက် ကျေးဇူးတင်ပါတယ်။
#DetailProjects
#JavaScript
#ThuHtetTun