2017-02-21 71 views
-1

使用直線JS與玩家對cpu設置進行井字遊戲。我試圖找出一個隨機函數的CPU轉。它正在打破這個功能,並通過它。 console.log(cpuTurn());在玩家標出正方形後總是返回false。 (我==「」)blanks.push([我]);我有一個問題,我認爲這是一個問題:if(i ==「」)blanks.push([i]);如果我聲明一個像Val這樣的變量,並把它放在前面,就像這樣:if(Val(i)==「」)...我會得到一個錯誤,說明'Val'不是函數。針對井字遊戲不能正常工作的隨機javascript AI功能

我以什麼我需要在這裏做完全糊塗了......

var player = "X"; 
 
var cpu = "O"; 
 
var currentTurn = player; 
 

 
function startGame() { 
 

 
\t for(var i = 1; i <= 9; i++) { 
 
\t \t clearBoard(i); 
 
\t } 
 

 
\t document.winner = null; 
 
\t setMessage("Player " + currentTurn + ", please start the game."); 
 
} 
 

 
function setMessage(message) { 
 
\t document.getElementById("message").innerText = message; 
 
} \t 
 

 
function nextMove(square) { 
 
\t if (document.winner != null) { 
 
\t \t setMessage(currentTurn + " has already won."); 
 
\t } else if(square.innerText == '') { 
 
\t square.innerText = currentTurn; 
 
\t swapTurn(); \t \t 
 
\t } else { 
 
\t \t setMessage("No cheating, choose another square."); 
 
\t } 
 
} 
 

 
function swapTurn() { 
 
\t if(checkForWinner(currentTurn)) { 
 
\t \t setMessage(currentTurn + " has won!"); 
 
\t \t document.winner = currentTurn; 
 
\t } else if(checkForDraw(currentTurn)) { 
 
\t \t setMessage("Its a draw!"); 
 
\t } else if(currentTurn == player){ 
 
\t \t currentTurn = cpu; 
 
\t \t setMessage("Player " + currentTurn + ", it's your turn."); 
 
\t \t cpuMove(); 
 
\t } else { 
 
\t \t currentTurn = player; 
 
\t \t setMessage("Player " + currentTurn + ", it's your turn."); 
 
\t } 
 
} 
 

 
function checkForWinner(move) { 
 
\t var result = false; 
 
\t if(checkRow(1,2,3, move) || 
 
\t checkRow(4,5,6, move) || 
 
\t checkRow(7,8,9, move) || 
 
\t checkRow(1,4,7, move) || 
 
\t checkRow(2,5,8, move) || 
 
\t checkRow(3,6,9, move) || 
 
\t checkRow(1,5,9, move) || 
 
\t checkRow(3,5,7, move)) { 
 
\t  \t result = true; 
 
\t } 
 
\t return result; 
 
} 
 

 
function checkForDraw(move) { 
 
\t var draw = false; 
 
\t if (((getBox(1) == "X") || (getBox(1) == "O")) && 
 
\t \t ((getBox(2) == "X") || (getBox(2) == "O")) && 
 
\t \t ((getBox(3) == "X") || (getBox(3) == "O")) && 
 
\t \t ((getBox(4) == "X") || (getBox(4) == "O")) && 
 
\t \t ((getBox(5) == "X") || (getBox(5) == "O")) && 
 
\t \t ((getBox(6) == "X") || (getBox(6) == "O")) && 
 
\t \t ((getBox(7) == "X") || (getBox(7) == "O")) && 
 
\t \t ((getBox(8) == "X") || (getBox(8) == "O")) && 
 
\t \t ((getBox(9) == "X") || (getBox(9) == "O"))) { 
 
     draw = true; 
 
     } 
 
     return draw; 
 
} 
 

 
function checkRow(a, b, c, move) { 
 
\t var result = false; 
 
\t if(getBox(a) == move && getBox(b) == move && getBox(c) == move) { 
 
\t \t result = true; 
 
\t } 
 
\t return result; 
 
} 
 

 
function getBox(number) { \t \t \t \t \t \t \t \t \t 
 
\t return document.getElementById("s" + number).innerText; \t 
 
} 
 

 
function clearBoard(number) { 
 
\t document.getElementById("s" + number).innerText = ""; 
 
} 
 

 
function cpuMove() { 
 
\t var blanks = []; 
 
\t //var val = 0; 
 
\t for (var i = 1; i <= 9; i++) { 
 
\t \t if (i == "")blanks.push([i]); 
 
\t } 
 
\t if (blanks.length > 0) { 
 
\t \t var r = Math.floor((Math.random()*blanks.length)); 
 
     return blanks[r]; 
 
     } else { 
 
     return false; 
 
     } \t 
 
}
\t <style> 
 

 
\t \t body { 
 
\t \t \t width:550px; 
 
\t \t \t margin: auto; 
 
\t \t } 
 

 
\t \t h1 { 
 

 
\t \t } 
 

 
\t \t #message { 
 
\t \t \t font-family:; 
 
\t \t \t font-size:; 
 
\t \t } 
 

 
\t \t .square { 
 
\t \t \t height: 100px; 
 
\t \t \t width: 100px; 
 
\t \t \t font-size: 60pt; 
 
\t \t \t text-align: center; 
 
\t \t \t font-weight: bold; 
 
\t \t } 
 

 
\t </style>
<body onload="startGame();"> 
 
\t <h1>Tom's Tic Tac Toe in JS</h1> 
 

 
\t <div id="message">MESSAGE HERE</div> 
 

 
\t <table border = "1"> 
 
\t \t <tr> 
 
\t \t \t <td class="square" id="s1" onClick="nextMove(this)"></td> 
 
\t \t \t <td class="square" id="s2" onClick="nextMove(this)"></td> 
 
\t \t \t <td class="square" id="s3" onClick="nextMove(this)"></td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td class="square" id="s4" onClick="nextMove(this)"></td> 
 
\t \t \t <td class="square" id="s5" onClick="nextMove(this)"></td> 
 
\t \t \t <td class="square" id="s6" onClick="nextMove(this)"></td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td class="square" id="s7" onClick="nextMove(this)"></td> 
 
\t \t \t <td class="square" id="s8" onClick="nextMove(this)"></td> 
 
\t \t \t <td class="square" id="s9" onClick="nextMove(this)"></td> 
 
\t \t </tr> 
 
\t </table> 
 
\t <a href="javascript: startGame();" id="restart">New Game</a> 
 
\t <script src="main.js"></script> 
 
</body> 
 
</html>

我在堆棧通過一噸的問題,讀到這裏,但似乎沒有要類似於我的問題。預先感謝您的幫助。

+0

熟悉的調試器,它應該是很容易步執行代碼,看看發生了什麼。 –

+0

var Val = 0;你正在使用它像Val(i)? –

+0

'i =='「'整數與字符串相比如何? –

回答

1

我可能會在這裏丟失一些東西,但是如果您在for循環中指定i,那麼i何時會是「」?

0

以下是您的解決方案。 讓我知道,如果你無法理解,我將解釋

function cpuMove() { 

    var blanks = []; 
    for (var i = 1; i <= 9; i++) { 
    var place = document.getElementById("s"+i).innerText 
    if(place == "") blanks.push([i]); 
    } 
    if (blanks.length > 0) { 
    var r = Math.floor((Math.random() * blanks.length)); 
    nextMove(document.getElementById("s"+blanks[r])); 
    } 
} 
+0

太棒了!它非常有意義。我不能夠感謝你。我迫不及待地想要和JS一起達到新的水平......因此開始感到沮喪。再次感謝! – LANole

+0

投票將不勝感激@LANOLE :) –

+1

我做了...它被記錄,但因爲我在15個代表點,它不顯示。這不是這個問題被拒絕了。抱歉。 – LANole