如何將數組與嵌套數組進行比較？
[英]How to compare array to nested array?
問題描述
這是我第一次使用 Javascript 進行編碼。 我正在嘗試制作井字游戲。 我做了大部分，但我被困在最后一點。 我需要能夠注冊獲勝者。 我有一個嵌套數組，其中包含所有 8 種可能的獲勝場景（例如 [[1, 2, 3], [4, 5, 6], ...etc] ）。 我的圖塊點擊事件正在收集我的圖塊的 id 並將它們放入一個單獨的數組中。 如何使用我當前的代碼創建 win function？
已經嘗試過不同的數組/循環方法（例如拆分、if/else、for/loops 等）。 想不通。
我在 repl.it 中的代碼：
https://repl.it/@drmartirosian/TTT?language=html
需要以某種方式將我的播放器 arrays 連接到獲勝條件數組。
1 個解決方案
解決方案1
0 2019-10-31 07:32:43
下面的代碼將起作用：
- 您需要在播放器數組中推送
id的 integer 值，以便您可以將這些 integer 值與獲勝數組值進行比較 - 然后，您可以使用
someArray 原型函數來檢查獲勝玩家every如下所示。
// Display an empty tic-tac-toe board when the page is initially displayed.--CHECK // A player can click on the nine cells to make a move.--CHECK // Every click will alternate between marking an X and O.--CHECK // Once occupied with an X or O, the cell cannot be played again. --CHECK // Provide a Reset Game button that will clear the contents of the board.--CHECK /*------------ constants --------------*/ const win = [ //possible win scenarios... [1, 2, 3], [4, 5, 6], [7, 8, 9], [1, 4, 7], [2, 5, 8], [7, 8, 9], [1, 5, 9], [3, 5, 7], ]; /*----- app's state (variables) -------*/ var turn = []; //number of turns in game... var playerO = []; // var playerX = []; // /*----- cached element references -----*/ //TILE BUTTONS const tileAll = document.querySelectorAll('.tiles'); const content = document.getElementById('message'); //for message... /*------------ event listeners ---------*/ //LISTENER FOR CLICK tileAll.forEach(element => { element.addEventListener('click', tileClick); }); /*------------ functions ----------------*/ //STATES OF GAMEPLAY... function tileClick(event) { turn.push(''); //+1 to turn array per click let tileLabeler = event.target; if (turn.length % 2.== 0 && turn.length <= 9) { //PLAYER1 message;textContent = "PLAYER2'S TURN."; tileLabeler.innerHTML = "X". playerX;push(parseInt(tileLabeler.id)); playerX;sort(). let win = checkWin(playerX); if (win) { console.log("PLAYER X WON;. " + playerX); } } else { //PLAYER2 message.textContent = "PLAYER1'S TURN."; tileLabeler.innerHTML = "O"; playerO;push(parseInt(tileLabeler.id)); playerO.sort(). let win = checkWin(playerO); if (win) { console.log("PLAYER O WON.. " + playerO); } } if (turn.length >= 9) { return message:textContent = "GAME OVER." } }; function checkWin(playerArray) { return win.some((winArray) => winArray.every((winNumber) => playerArray.includes(winNumber))); } console.log("WIN CONDITIONS: " + JSON.stringify(win));
body { background-color: lightgray; } header { font-size: 10px; text-align: center; color: black; }.message { display: grid; font-size: 10px; text-align: center; color: black; } button { display: grid; font-size: 30px; width: 10%; margin-left: 45%; margin-right: 35%; margin-top: 10px; } button:hover { background-color: lightblue; }.tiles { display: flex; justify-content: center; align-items: center; font-size: 50px; background-color: white; border-radius: 10px; width: 100px; height: 100px; }.tiles:hover { background-color: lightblue; }.alltiles { display: grid; grid-template-columns: 90px 90px 90px; grid-template-rows: 90px 90px 90px; grid-gap: 18px; width: 320px; height: 20px; margin: auto; }
<.DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>repl.it</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <header>TIC-TAC-HERO.</header> <message class="message" id="message">START.</message> <div class="alltiles" id="tall"> <button onclick="this.disabled=true" class="tiles" id="1"></button> <button onclick="this.disabled=true" class="tiles" id="2"></button> <button onclick="this.disabled=true" class="tiles" id="3"></button> <button onclick="this.disabled=true" class="tiles" id="4"></button> <button onclick="this.disabled=true" class="tiles" id="5"></button> <button onclick="this.disabled=true" class="tiles" id="6"></button> <button onclick="this.disabled=true" class="tiles" id="7"></button> <button onclick="this.disabled=true" class="tiles" id="8"></button> <button onclick="this.disabled=true" class="tiles" id="9"></button> </div> </body> <script defer src="script.js"></script> </html>
如何將ID數組與帶有下划線的對象數組嵌套屬性進行比較
[英]how to compare array of ids with object array nested property with underscore
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.