0

我正在用Javascript、HTML和CSS编写一个井字游戏应用程序，我必须在其中练习将所有功能放置在模块或工厂中。目前我在访问其他模块内的工厂创建对象时遇到问题。

我的完整代码可以在这里找到： https ://codepen.io/wulfenn/pen/xxVqGrW

我的代码细分：

我有两个模块和一个工厂；gameBoard是负责任何与板相关的模块。（读板、修改板、视觉效果等）

该game模块负责功能（开始新回合、处理玩家回合、检查获胜者等）

最后，Player我的工厂用于创建新播放器并具有简单的功能，例如检索名称或检索分配给它的标记。（X 或 O）

我目前遇到的问题是在模块const p1 = Player('P1Name', 'X')内部创建播放器时，特别是其中的函数。如果我尝试在所述函数中访问它，我没有问题，但其余代码无法访问它。gamesoloPlay()

const p1 = Player('P1Name', 'X')如果我要在我的工厂和模块之外创建一个，所有代码都可以访问它。但问题是我需要能够在模块内的soloPlay()函数中创建一个新播放器。game

我怎样才能进行调用soloPlay()并且仍然能够访问 P1 和 P2 对象以及它们在代码之外的功能？

感谢您的帮助，如果我的代码混乱或糟糕，我深表歉意，我仍在学习。

如果您不想浏览我的所有项目，请使用相关代码：

游戏模块中的 soloPlay()。

  // Our second menu for solo play, to set the P1 name, and start the game once done.
  const soloPlay = () => {
    const enterBtn = document.querySelector('.enter-btn');
    enterBtn.addEventListener('click', function () {
      const p1 = Player(document.querySelector('.p1').textContent, 'X');
      const p2 = Player('AI', 'O');
      const soloMenu = document.querySelector('.solo-menu');
      soloMenu.style.display = 'none';
      const gameMenu = document.querySelector('.menu-bg');
      gameMenu.style.display = 'none';
      game.setup(); // Sets our grid listeners
      game.newRound(); // Starts a new round.
    });
  }

播放器工厂

/* Our player factory in charge of creating new players, and assigning them functions to obtain their names and marks */

const Player = (name, mark) => {
  const hasTurn = true;
  const getName = () => name;
  const getMark = () => mark;

  return { getName, getMark, hasTurn };
}
4

1 回答 1

0

来源：https ://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/const

声明一个变量 const，用块范围定义它，这意味着创建它的函数之外的任何东西都无法看到它......对于你的玩家来说，你没有改变 Player 工厂，你正在创建一个实例当您声明 const p1 = Player....p1 时，它是在 soloPlay 中创建的，并且代码的任何其他部分都无法访问它...如果您将 p1 和 p2 声明为全局（在任何其他范围之外或在您选择的对代码有意义的范围内） ) 而不是将它们声明为const您的游戏应该可以运行。

//This goes outside 'const gameBoard'
var p1;
var p2;

并且没有在这里声明 p1 和 p2 为const：

const soloPlay = () => {
    const enterBtn = document.querySelector('.enter-btn');
    enterBtn.addEventListener('click', function () {
      p1 = Player((document.querySelector('#p1').value), 'X');
      console.log('Jugador 1: '+p1.getName());
      p2 = Player('AI', 'O');
      console.log('Jugador 2: '+p2.getName());
      const soloMenu = document.querySelector('.solo-menu');
      soloMenu.style.display = 'none';
      const gameMenu = document.querySelector('.menu-bg');
      gameMenu.style.display = 'none';
      game.setup(); // Sets our grid listeners
      game.newRound(); // Starts a new round.
    });
  }
于 2020-08-25T19:17:40.243 回答