Javascript 从其他模块中的工厂函数调用函数不会';行不通
我有两个模块:boardObject和displayController。。。还有一个工厂功能:playerFactory。。。我想用playerFactory中的函数更新数组,但得到的错误不是函数Javascript 从其他模块中的工厂函数调用函数不会';行不通,javascript,module,factory,Javascript,Module,Factory,我有两个模块:boardObject和displayController。。。还有一个工厂功能:playerFactory。。。我想用playerFactory中的函数更新数组,但得到的错误不是函数 const playerFactory = () => { const playTurn = (event) => { const id = boardObject.cells.indexOf(event.target); boardObject.
const playerFactory = () => {
const playTurn = (event) => {
const id = boardObject.cells.indexOf(event.target);
boardObject.boardArray[id] = currentPlayer;
boardObject.render();
return id;
};
return { playTurn };
};
有什么问题吗?
如果有人想查看所有代码,这也可能会有所帮助:
//播放器工厂。。。
const playerFactory=()=>{
const playTurn=(事件)=>{
const id=boardObject.cells.indexOf(event.target);
boardObject.boardArray[id]=currentPlayer;
boardObject.render();
};
返回{
游戏回合
};
};
//游戏板对象。。。
const boardObject=(()=>{
让boardArray=['','','','','','','','';
const cells=Array.from(document.queryselectoral(“.cell”);
//显示boardArray的内容。。。
常量渲染=()=>{
boardArray.forEach((标记,idx)=>{
单元格[idx].textContent=boardArray[idx];
});
};
返回{
boardArray,
提供,
细胞
};
})();
//显示控制器。。。
const displayController=(()=>{
const playerOne='X';
常量playerTwo='O'
const gameBoard=document.querySelector(“.game_board”);
让currentPlayer=playeron;
常量switchPlayer=()=>{
currentPlayer=currentPlayer===playerOne?playerTwo:playerOne;
}
gameBoard.addEventListener(“单击”,(事件)=>{
if(event.target.classList.contains(“单元格”)){
如果(event.target.textContent==“”){
event.target.textContent=currentPlayer;
switchPlayer();
//const id=boardObject.cells.indexOf(event.target);
//boardObject.boardArray[id]=currentPlayer;
//boardObject.render();
////////
currentPlayer.playTurn(事件);//这就是问题所在,不知道为什么?!?!?!?
}
}
});
})();代码>
*,
*::之前,
*::之后{
框大小:边框框;
保证金:0;
填充:0;
}
身体{
字体系列:“Roboto”,无衬线;
背景:#BEE9E8;
}
标题{
背景#1B4965;
文本对齐:居中;
颜色:#62B6CB;
填充顶部:20px;
垫底:10px;
}
.游戏板{
显示:网格;
宽度:500px;
高度:500px;
网格模板行:重复(3,1fr);
网格模板列:重复(3,1fr);
保证金:0自动;
边缘顶端:40px;
边框:5px实心#1B4965;
边界半径:10px;
}
.细胞{
边框:5px实心#1B4965;
显示器:flex;
证明内容:中心;
对齐项目:居中;
背景:#62b6cb;
颜色:#1b4965;
字号:4em;
字体大小:粗体;
}
井字过三关
Tic-Tac-Toe
奥丁项目
currentPlayer
只是一个字符串X
或O
,它没有playTurn()
方法
您需要调用playerFactory()
来获取对象。在下面的代码中,我使用
const player = playerFactory();
我真的不知道为什么你首先需要这个东西;它不保持任何状态。但也许这是你以后打算添加的内容
此外,playTurn()
需要传递currentPlayer
字符串,以便将其分配给网格元素。它是gameController
中的局部变量,因此无法直接访问它
//播放器工厂。。。
const playerFactory=()=>{
const playTurn=(事件,当前玩家)=>{
const id=boardObject.cells.indexOf(event.target);
boardObject.boardArray[id]=currentPlayer;
boardObject.render();
};
返回{
游戏回合
};
};
//游戏板对象。。。
const boardObject=(()=>{
让boardArray=['','','','','','','','';
const cells=Array.from(document.queryselectoral(“.cell”);
//显示boardArray的内容。。。
常量渲染=()=>{
boardArray.forEach((标记,idx)=>{
单元格[idx].textContent=boardArray[idx];
});
};
返回{
boardArray,
提供,
细胞
};
})();
//显示控制器。。。
const displayController=(()=>{
const player=playerFactory();
const playerOne='X';
常量playerTwo='O'
const gameBoard=document.querySelector(“.game_board”);
让currentPlayer=playeron;
常量switchPlayer=()=>{
currentPlayer=currentPlayer===playerOne?playerTwo:playerOne;
}
gameBoard.addEventListener(“单击”,(事件)=>{
if(event.target.classList.contains(“单元格”)){
如果(event.target.textContent==“”){
event.target.textContent=currentPlayer;
switchPlayer();
//const id=boardObject.cells.indexOf(event.target);
//boardObject.boardArray[id]=currentPlayer;
//boardObject.render();
////////
player.playTurn(事件,当前玩家);
}
}
});
})();代码>
*,
*::之前,
*::之后{
框大小:边框框;
保证金:0;
填充:0;
}
身体{
字体系列:“Roboto”,无衬线;
背景:#BEE9E8;
}
标题{
背景#1B4965;
文本对齐:居中;
颜色:#62B6CB;
填充顶部:20px;
垫底:10px;
}
.游戏板{
显示:网格;
宽度:500px;
高度:500px;
网格模板行:重复(3,1fr);
网格模板列:重复(3,1fr);
保证金:0自动;
边缘顶端:40px;
边框:5px实心#1B4965;
边界半径:10px;
}
.细胞{
边框:5px实心#1B4965;
显示器:flex;
证明内容:中心;
对齐项目:居中;
背景:#62b6cb;
颜色:#1b4965;
字号:4em;
字体大小:粗体;
}
井字过三关
Tic-Tac-Toe
奥丁项目
确切的错误消息是什么?playerne
和playerner两个
只是字符串。。。。。您从未调用过playerFactory
TypeError:currentPlayer.playTurn不是函数,但即使我调用了playerFactory.playTurn,它也不起作用…playerFactory().playTurn()
。这两种方法都是。我会的
const player = playerFactory();