Как я могу избежать написания повторяющегося кода на javascript для моей игры в крестики-нолики?

#javascript

Вопрос:

Я хочу создать игру в крестики-нолики в html с использованием javascript. Я нахожусь в самом начале, но я перепробовал много вещей, но, похоже, я не могу сделать этот код короче, чтобы он не повторялся. Это всего лишь фрагмент кода.

 var turn = true;

function place1(){
 if(turn == true){
  xb1();
 } else{
  ob1();
 }
 b1.removeEventListener("click", place1);
}

function xb1(){
 b1.classList.add("x");
 console.log(turn);
 turn = !turn;
}

function ob1(){
 b1.classList.add("o");
 console.log(turn);
 turn = !turn;
}

var b1 = document.querySelector("#b1");
b1.addEventListener("click", place1);




function place2(){
 if(turn == true){
  xb2();
 } else{
  ob2();
 }
 b2.removeEventListener("click", place2);
}

function xb2(){
 b2.classList.add("x");
 console.log(turn);
 turn = !turn;
}

function ob2(){
 b2.classList.add("o");
 console.log(turn);
 turn = !turn;
}

var b2 = document.querySelector("#b2");
b2.addEventListener("click", place2);

1. один вопрос.. КАК ЭТО повторяется?

2. Существуют аналогичные функции. Один, чтобы разместить «X», один, чтобы разместить «0», и сама функция «место». Я хочу, чтобы у меня было только 3 функции, которые я могу использовать, а не 27 для каждой коробки (9 коробок с 3 функциями каждая).

3. Эй, Алин, это довольно сложная задача для новичка, и ваше нежелание повторять код понятно. Следующая ссылка, которую я нашел в поиске Google для Javascript tic tac toe, очень поможет вам, и если вы прочтете код и объяснения, я думаю, это поможет вам понять гораздо больше. dev.to/bornasepic/…

Ответ №1:

Это не ответ на то, как вы могли бы создать игру, но попробуйте подход функционального программирования, также научитесь писать чистый код, называйте свои функции таким образом, чтобы он мог объяснить, что он делает. Кроме того, прежде чем пытаться закодировать его, составьте список со всеми функциями, которыми должна обладать ваша игра. Пример :

Для крестиков-ноликов у вас может быть функция, которая присваивает значение квадрату, на который вы нажали.
У вас должна быть функция, которая проверяет, выиграл ли кто-то.
Вы должны где-то хранить свои данные, и когда что-то меняется, должны быть какие-то функции для запуска.
и т.д. Надеюсь, я вам как-то помог.