Sat Jan 04 2025 • 3 mins read
Javascript မှာ array ဒါမှမဟုတ် object တွေကို တန်ဖိုးအသစ်အဖြစ် copy ကူးယူတဲ့အခါ ကျနော်တို့ ထင်သလောက် မရိုးရှင်းဘဲ စိတ်ရှုပ်စရာ၊ သတိထားစရာလေးတွေရှိနေပါတယ်။ အဲဒါတွေဟာ reference တွေရဲ့အလုပ်လုပ်ပုံ၊ deep copy နဲ့ shallow copy တွေကြားမတူညီတဲ့ အလုပ်လုပ်ပုံစတာကြောင့်ဖြစ်ပါတယ်။ ဒီအရာတွေဟာ မလိုလားအပ်တဲ့ bug တွေကို ဖြစ်ပေါ်စေနိုင်ပါတယ်။
ဒီတော့ shallow copy ဆိုတာ ဘာလဲ။
Shallow copy ဆိုတာ array ဒါမှမဟုတ် object တခုကို မူလတန်ဖိုးကနေတဆင့် အသစ်တခုအဖြစ် copy ကူးယူဖန်တီးတဲ့နည်းလမ်းဖြစ်ပါတယ်။ ထူးခြားတာက မူလ object မှာ nested object တွေသာ ထပ်ဆင့်ပါဝင်နေခဲ့ရင် အဲဒီ object တွေကို reference တန်ဖိုးအနေနဲ့ သာ သိမ်းဆည်းသွားတာဖြစ်ပါတယ်။
"A shallow copy of an object or array means creating a new object or array with the same top-level elements."
ဆိုလိုတာက အဆိုပါ nested object တွေရဲ့ မူလတန်ဖိုးတခုခုကိုသာ ပြောင်းလဲခဲ့ရင် copy ယူထားတဲ့ တန်ဖိုးမှာပါ လိုက်ပြီးပြောင်းလဲသွားမှာကို ဆိုလိုတာပါ။
အလားတူပဲ copy ယူထားတဲ့ တန်ဖိုးကို ပြောင်းလဲခဲ့ရင်လည်း မူလတန်ဖိုးမှာပါ လိုက်ပြီးပြောင်းလဲသွားမှာဖြစ်ပါတယ်။
ဥပမာ -
let original = { name: "Alice", details: { age: 25 } };
let shallowCopy = {...original};
shallowCopy.details.age = 30;
console.log(original.details.age); // Output: 30
console.log(shallowCopy.details.age); // Output: 30
အပေါ်က နမူနာ ကုဒ်မှာဆိုရင် original ဆိုတဲ့ variable လေးရဲ့ မူလတန်ဖိုးကို shallow copy သုံးပြီး တန်ဖိုးအသစ်တခု ကူးယူပါတယ်။ အဲဒီနောက်မှာ shallow copy ယူထားတဲ့ variable ကတဆင့် တန်ဖိုးအသစ်တခုကို ပြောင်းလဲလိုက်တဲ့အခါ မူလ original ဆိုတဲ့ variable လေးရဲ့ တန်ဖိုးမှာပါ ပြောင်းလဲသွားတာကို တွေ့ရမှာဖြစ်ပါတယ်။
Shallow copy အဖြစ်ကူယူးနိုင်တဲ့နည်းလမ်းတွေရှိပါတယ်။ အသုံးများတာက -
1. Object.assign()
2. Spread Operator eg: {...obj1}
3. Array.slice()
စတဲ့ method တွေဖြစ်ပါတယ်။
ဒီတော့ deep copy ဆိုတာ ဘာလဲ။
Deep copy ဆိုတာ array ဒါမှမဟုတ် object တခုရဲ့တန်ဖိုးကို အပြည့်အဝကူးယူပြီး မူလတန်ဖိုးနဲ့ copy တန်ဖိုးကြား မည်သည့်ဆက်စပ်မှုမှ မရှိစေတဲ့နည်းလမ်းဖြစ်ပါတယ်။
"A deep copy involves copying all levels of an object or array, creating a completely independent copy."
ဆိုလိုတာက original နဲ့ copied version ကြားမှာ shallow copy လိုမျိုး reference တန်ဖိုးတွေကို သိမ်းဆည်းတာမျိုးမရှိပါဘူး။ ဒါကြောင့်ပဲ မူလတန်ဖိုးကို ပြောင်းလဲခဲ့ရင်တောင် copy ယူထားတဲ့တန်ဖိုးဟာ ပြောင်းလဲသွားမှာမဟုတ်ပါဘူး။ Deep copy နည်းလမ်းဟာ completely independent copy တန်ဖိုးတခုကို သာ ဖန်တီးပေးတာဖြစ်ပါတယ်။
ဥပမာ -
let original = { name: "Alice", details: { age: 25 } };
let deepCopy =structuredClone(original);
deepCopy.details.age = 30;
console.log(original.details.age); // Output: 25
console.log(deepCopy.details.age); // Output: 30
အပေါ်က နမူနာ ကုဒ်မှာဆိုရင် original ဆိုတဲ့ variable လေးရဲ့ မူလတန်ဖိုးကို structuredClone ဆိုတဲ့ method ကိုသုံးပြီး deep copy အဖြစ် တန်ဖိုးအသစ်တခု ကူးယူပါတယ်။ အဲဒီနောက်မှာ deep copy ယူထားတဲ့ variable ကတဆင့် တခြားတန်ဖိုးကို ပြောင်းလဲလိုက်ပါတယ်။ သို့ပေမယ့် မူလ original ဆိုတဲ့ variable လေးရဲ့ တန်ဖိုးကတော့ shallow copy လိုမျိုး ပြောင်းလဲ မသွားတာကို တွေ့ရမှာဖြစ်ပါတယ်။ ဆိုလိုတာက original နဲ့ deepCopy ဆိုတဲ့ variable တန်ဖိုးနှစ်ခုဟာ entirely separate ဖြစ်နေတာမျိုး ဖြစ်ပါတယ်။
Deep copy အဖြစ်ကူယူးနိုင်တဲ့နည်းလမ်းတွေရှိပါတယ်။ အသုံးများတာက -
1. JSON.stringify()
နဲ့ JSON.parse()
2. structuredClone()
3. lodash ရဲ့ cloneDeep()
စတဲ့ method တွေဖြစ်ပါတယ်။
ဒီတော့ ဘယ်အချိန်မှာ deep ကိုသုံးပြီး ဘယ်အချိန်မှာ shallow ကိုသုံးရမလဲ
Shallow copy ကို flat object ဒါမှမဟုတ် array တွေအတွက် အသုံးပြုနိုင်ပါတယ်။ အကယ်၍ ကိုယ်က မူလ variable တန်ဖိုးရဲ့ nested object တွေကို ပြင်ဆင်ပြောင်းလဲခြင်းမရှိဘူးဆိုရင် shallow copy ကိုသုံးနိုင်ပါတယ်။
Deep copy ကိုတော့ nested object တွေ၊ array တွေအတွက် အသုံးပြုနိုင်ပါတယ်။ အကယ်၍ မူလတန်ဖိုးနဲ့ copy တန်ဖိုးကြား ဆက်စပ်မှုမရှိစေချင်တဲ့အခါ deep copy ကို အသုံးပြုနိုင်ပါတယ်။
#javascript #coding #webdevelopment