တုံ့ပြန် ကျူတိုရီရယ်

React Home React Intro React စတင်လိုက်ပါ။ ES6 ကို တုံ့ပြန်ပါ။ Render HTML ကို တုံ့ပြန်ပါ။ JSX ကို တုံ့ပြန်ပါ။ အစိတ်အပိုင်းများကို တုံ့ပြန်ပါ။ React Class React Props အဖြစ်အပျက်များကို တုံ့ပြန်ပါ။ အခြေအနေများကို တုံ့ပြန်ပါ။ တုံ့ပြန်မှုစာရင်းများ တုံ့ပြန်မှုပုံစံများ Router ကို တုံ့ပြန်ပါ။ တုံ့ပြန်မှတ်စု CSS Styling ကို တုံ့ပြန်ပါ။ Sass Styling ကို တုံ့ပြန်ပါ။

React Hooks

Hook ဆိုတာဘာလဲ။ ပြည်နယ်ကိုအသုံးပြုပါ။ အသုံးပြုမှုအကျိုးသက်ရောက်မှု အသုံးအနှုန်း အသုံးပြုရန် Ref Reducer ကိုအသုံးပြုပါ။ ဖုန်းခေါ်ဆိုမှုကို အသုံးပြုပါ။ Memo ကိုအသုံးပြုပါ။ စိတ်ကြိုက်ချိတ်

တုံ့ပြန်လေ့ကျင့်မှုများ

တုံ့ပြန်မေးခွန်း တုံ့ပြန်လေ့ကျင့်မှုများ တုံ့ပြန်လက်မှတ်

ES6 ဖျက်ဆီးခြင်းကို တုံ့ပြန်ခြင်း။


ဖျက်ဆီးခြင်း။

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

ဖျက်ဆီးခြင်းမှာ အတူတူပင်ဖြစ်သည်။ ကျွန်ုပ်တို့တွင် လုပ်ဆောင်နေသော array သို့မဟုတ် အရာဝတ္ထုတစ်ခု ရှိကောင်းရှိနိုင်သော်လည်း ၎င်းတို့တွင်ပါရှိသော အရာအချို့သာ လိုအပ်ပါသည်။

Destructuring သည် လိုအပ်သောအရာများကိုသာ ထုတ်ယူရန် လွယ်ကူစေသည်။


Array များကိုဖျက်စီးခြင်း။

ဤသည်မှာ variable တစ်ခုသို့ array items များသတ်မှတ်ခြင်းနည်းလမ်းဟောင်းဖြစ်သည် ။

အရင်က

const vehicles = ['mustang', 'f-150', 'expedition'];

// old way
const car = vehicles[0];
const truck = vehicles[1];
const suv = vehicles[2];

ဤသည်မှာ array item များကို variable တစ်ခုသို့ assign လုပ်နည်းအသစ်ဖြစ်သည် ။

ဖျက်ဆီးမှုနှင့်အတူ-

const vehicles = ['mustang', 'f-150', 'expedition'];

const [car, truck, suv] = vehicles;

array များကို ဖျက်သည့်အခါ၊ variable များကို ကြေငြာသည့် order သည် အရေးကြီးပါသည်။

ကားနဲ့ suv ကိုသာ လိုချင်ရင် ထရပ်ကားကို ထွက်သွားပေမယ့် ကော်မာကို သိမ်းထားနိုင်ပါတယ်

const vehicles = ['mustang', 'f-150', 'expedition'];

const [car,, suv] = vehicles;

လုပ်ဆောင်ချက်တစ်ခုသည် array တစ်ခုအား ပြန်ပေးသောအခါတွင် ပျက်စီးစေရန်အတွက် အဆင်ပြေပါသည်။

ဥပမာ

function calculate(a, b) {
  const add = a + b;
  const subtract = a - b;
  const multiply = a * b;
  const divide = a / b;

  return [add, subtract, multiply, divide];
}

const [add, subtract, multiply, divide] = calculate(4, 7);


w3schools CERTIFIED . 2022

လက်မှတ်ရယူပါ။

React modules များကိုဖြည့်ပါ၊ လေ့ကျင့်ခန်းများလုပ်ပါ၊ စာမေးပွဲကိုဖြေဆိုပြီး w3schools မှ certified ဖြစ်လာပါ။

$95 စာရင်းသွင်းပါ။

အရာဝတ္ထုများကို ဖျက်ဆီးခြင်း။

ဤသည်မှာ လုပ်ဆောင်ချက်တစ်ခုအတွင်းရှိ အရာဝတ္တုတစ်ခုကို အသုံးပြုခြင်းနည်းလမ်းဟောင်းဖြစ်သည်။

အရင်က

const vehicleOne = {
  brand: 'Ford',
  model: 'Mustang',
  type: 'car',
  year: 2021, 
  color: 'red'
}

myVehicle(vehicleOne);

// old way
function myVehicle(vehicle) {
  const message = 'My ' + vehicle.type + ' is a ' + vehicle.color + ' ' + vehicle.brand + ' ' + vehicle.model + '.';
}

ဤသည်မှာ လုပ်ဆောင်ချက်တစ်ခုအတွင်းရှိ အရာဝတ္တုတစ်ခုကို အသုံးပြုနည်းအသစ်ဖြစ်သည် ။

ဖျက်ဆီးမှုနှင့်အတူ-

const vehicleOne = {
  brand: 'Ford',
  model: 'Mustang',
  type: 'car',
  year: 2021, 
  color: 'red'
}

myVehicle(vehicleOne);

function myVehicle({type, color, brand, model}) {
  const message = 'My ' + type + ' is a ' + color + ' ' + brand + ' ' + model + '.';
}

အရာဝတ္ထုဂုဏ်သတ္တိများကို တိကျသောအစီအစဥ်ဖြင့် ကြေညာရန်မလိုအပ်ကြောင်း သတိပြုပါ။

မြှုပ်ထားသောအရာဝတ္တုကို ကိုးကားကာ နက်ရှိုင်းစွာ အသိုက်အမြုံရှိသော အရာဝတ္ထုများကိုပင် ဖျက်ဆီးပစ်နိုင်သည်-

ဥပမာ

const vehicleOne = {
  brand: 'Ford',
  model: 'Mustang',
  type: 'car',
  year: 2021, 
  color: 'red',
  registration: {
    city: 'Houston',
    state: 'Texas',
    country: 'USA'
  }
}

myVehicle(vehicleOne)

function myVehicle({ model, registration: { state } }) {
  const message = 'My ' + model + ' is registered in ' + state + '.';
}


လေ့ကျင့်ခန်းများဖြင့် သင့်ကိုယ်သင် စမ်းသပ်ပါ။

လေ့ကျင့်ခန်း

array မှတတိယပစ္စည်းကိုသာ ထုတ်ယူရန်၊ အမည်ရှိ ကိန်းရှင်တစ်ခုသို့ ဖျက်ထုတ်ခြင်းကို အသုံးပြုပါ suv

const vehicles = ['mustang', 'f-150', 'expedition'];

const [] = vehicles;