JavaScript

Как сделать что бы 2 функции выполнялись поочередно.JS

 function writeCircle() {

  const gameCell = document.querySelectorAll(".game_field");

  gameCell.forEach((el) => {

    el.addEventListener("click", (e) => {

      const circle = document.createElement("div");

      circle.classList.add("circle");

      e.target.append(circle);

    });

  });

}

//функция добавления крестика при клике

function writeCross() {

  const gameCell = document.querySelectorAll(".game_field");

  gameCell.forEach((el) => {

    el.addEventListener("click", (e) => {

      const cross = document.createElement("div");

      cross.classList.add("cross");

      e.target.append(cross);

    });

  });

}
делаю крестики нолики, есть 2 функции, одна на поле ресует крестик,другая нолик, как сделать что бы они выполнялись друг за другом,сначала одна,потом другая.
ВК
Владимир Козелько
22
Идея, похожая на предыдущий ответ, но с другой реализацией и позволяющая задать последовательность функций любой длины:
 function toggler(...func) {

  let idx = -1;

  return function() {

    func[idx = ++idx % func.length]();

  }  

}



let myToggle = toggler(writeCross, writeCircle);

myToggle();

myToggle();

myToggle();
Хотя, конечно, логичнее это делать через генератор и не выполнять функцию внутри генератора, а возвращать её:
 function *toggler(...func) {

  let idx = -1;

  for (;;) { yield func[idx = ++idx % func.length]; }

}



let myToggle = toggler(writeCross, writeCircle);

myToggle.next().value();

myToggle.next().value();

myToggle.next().value();
Иван Загул
Иван Загул
90 454
Лучший ответ
Открой для себя понятие callback, функция обратного вызова...
ИГ
Игорь Гуменюк
32 273
Странно что никто не говорит что эти функции спокойно можно объединить в одну. Они же пратически идентичные. Тип фигуры можно заключить внутри функции и переключать после каждого вызова.
 const gameField = document.querySelectorAll(".game_field"); 

 

const drawShape = function (){

  let shapeType;

  return function(){

    shapeType = shapeType == 'cross' ? 'circle' : 'cross';

    const shape = document.createElement("div");

    shape.className = shapeType;

    this.append(shape);

  }

}();



for(const square of gameField){

  square.addEventListener('click', drawShape);

}
СБ
Сергей Бондаренко
23 960 
 function writeCircle() { 

  const gameCell = document.querySelectorAll(".game_field"); 

  gameCell.forEach((el) => { 

    el.addEventListener("click", (e) => { 

      const circle = document.createElement("div"); 

      circle.classList.add("circle"); 

      e.target.append(circle); 

    }); 

  }); 

} 

//функция добавления крестика при клике 

function writeCross() { 

  const gameCell = document.querySelectorAll(".game_field"); 

  gameCell.forEach((el) => { 

    el.addEventListener("click", (e) => { 

      const cross = document.createElement("div"); 

      cross.classList.add("cross"); 

      e.target.append(cross); 

    }); 

  }); 

} 

// функция переключения функций

function toggler(a, b) { 

   var current; 

   return function() { 

      current = current === a ? b : a; 

      current(); 

   } 

} 

 

var myToggle = toggler(writeCircle, writeCross); 

myToggle(); // executes writeCircle

myToggle(); // executes writeCross

myToggle(); // executes writeCircle
Тахир Абдуллаев
Тахир Абдуллаев
7 589
просто вызывай эти функции внутри этих же самых функций
ЛС
Лёха Сучалкин
3 523

Похожие вопросы