JavaScript တွင် Tic-Tac-Toe ဂိမ်းအနိုင်ရရှိမှုကိုစစ်ဆေးခြင်း

ယခုအချိန်သည် အနိုင်ရသူကိုဆုံးဖြတ်ပြီး အနိုင်ရသူ၏အမည်ကို ပြသမည့် ကုဒ်ကိုရေးသားရန် အချိန်ကောင်းဖြစ်ပါသည်။

ပြဿနာကိုစဉ်းစားပြီးနောက် အနိုင်ရှိ/မရှိ စစ်ဆေးခြင်းကို ရွေးချယ်မှုတိုင်းတွင် ပြုလုပ်သင့်ကြောင်း သဘောပေါက်နိုင်ပါသည်။

javascriptfunction init(selector) {
  let cells = document.querySelectorAll('#field td');
  let i = 0;
  
  for (let cell of cells) {
    cell.addEventListener('click', function step() {
      this.textContent = ['X', 'O'][i % 2];
      this.removeEventListener('click', step);
      
      // ဤနေရာတွင် အနိုင်ရရှိမှု သို့မဟုတ် သရေကျခြင်းကို စစ်ဆေးသင့်ပါသည်။
      
      i++;
    });
  }
}

isVictory ဟုခေါ်သော function တစ်ခုကို ဖန်တီးကြပါစို့။ ထို function သည် parameter အဖြစ် ဆဲလ်များ array ကိုလက်ခံပြီး ကစားကွင်းတွင် အနိုင်ရရှိပါက true ကိုလည်းကောင်း၊ မရှိပါက false ကိုလည်းကောင်း return ပြန်ပေးပါမည်။ ကျွန်ုပ်တို့သည် ဤ function ကို အောက်ပါအတိုင်း အသုံးပြုပါမည်။

javascriptfunction start(cells) {
  let i = 0;
  
  for (let cell of cells) {
    cell.addEventListener('click', function step() {
      this.textContent = ['X', 'O'][i % 2];
      this.removeEventListener('click', step);
      
      if (isVictory(cells)) {
        alert('အနိုင်ရသူအမည်');
      }
      
      i++;
    });
  }
}

အနိုင်ရသူ၏အမည်ကို ကျွန်ုပ်တို့မည်သို့သိရှိနိုင်မည်နည်း။ သိသာထင်ရှားသည်မှာ သူ၏အမည်သည် အနိုင်ရသည့်ဆဲလ်တစ်ခုစီတိုင်းတွင် သိမ်းဆည်းထားပါသည်။ ရှင်းလင်းချက်ပေးပါမည်။ အကယ်၍ အနိုင်ရရှိပါက ဆိုလိုသည်မှာ အချို့သော 3 ဆဲလ်များ (အလျားလိုက်၊ ဒေါင်လိုက် သို့မဟုတ် ထောင့်ဖြတ်) တွင် တူညီသောတန်ဖိုး (X သို့မဟုတ် O) ပါရှိကြသည်။

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

javascriptfunction start(cells) {
  let i = 0;
  
  for (let cell of cells) {
    cell.addEventListener('click', function step() {
      this.textContent = ['X', 'O'][i % 2];
      this.removeEventListener('click', step);
      
      if (isVictory(cells)) {
        alert(this.textContent); // အနိုင်ရသူအမည်ကို ပြသခြင်း
      }
      
      i++;
    });
  }
}

isVictory ၏အကောင်အထည်ဖော်မှု

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

ဆိုလိုသည်မှာ အနိုင်ရရှိမှုစစ်ဆေးခြင်းအတွက် ဤအစုအဝေးအားလုံးကို ရိုးရိုးရှင်းရှင်းစစ်ဆေးနိုင်ပါသည်။ အစုအဝေးများတွင် တူညီပြီး ဗလာအမျိုးအစားမဟုတ်သော တန်ဖိုးများ (X သို့မဟုတ် O) ရှိ/မရှိ စစ်ဆေးရန်လိုအပ်ပါသည်။

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

javascriptlet combs = [
  [0, 1, 2],
  [3, 4, 5],
  [6, 7, 8],
  [0, 3, 6],
  [1, 4, 7],
  [2, 5, 8],
  [0, 4, 8],
  [2, 4, 6],
];

ဤ array ကိုအသုံးပြု၍ အနိုင်ရရှိမှုအဓိပ္ပာယ်ဖွင့်ဆိုချက်ကို ရေးသားကြပါစို့။

javascriptfunction isVictory(cells) {
  let combs = [
    [0, 1, 2],
    [3, 4, 5],
    [6, 7, 8],
    [0, 3, 6],
    [1, 4, 7],
    [2, 5, 8],
    [0, 4, 8],
    [2, 4, 6],
  ];

  for (let comb of combs) {
    if (
      cells[comb[0]].textContent == cells[comb[1]].textContent &&
      cells[comb[1]].textContent == cells[comb[2]].textContent &&
      cells[comb[0]].textContent != ''
    ) {
      return true;
    }
  }
  
  return false;
}