Сравнение 2 массивов, 1 ключ ответа, одна строка

Question

Im работает над игрой tic-tac-toe, и я пытаюсь сравнить 2 массива. Один массив имеет комбинации выигрышного ответа:

var answers = ["1,2,3", "1,4,7", "2,5,8", "3,6,9", "4,5,6", "7,8,9", "1,5,9", "3,5,7"]; 

В зависимости от DIV щелкнул, массив заполняется, что дивы соотнесения значения. Итак, если «X» нажимает на 1-й, 3-й & 5-й divs, массив для игрока X = 1,3,5.

Если игрок X нажимает окно 2, он выигрывает, потому что у него будет 3 подряд, потому что, когда 1,3,5,2 сравнивается с answers массива, answers[0] содержит все из этих значений тоже.

Сначала я пытался сравнить строки, но заказ является проблемой, поэтому пошел с попыткой сравнить целые числа. Все еще не уверен, правильно это или нет.

Answer 1

Вы можете выполнить итерацию answers и проверить позиции winnig против выбранных позиций.

Это предложение использует

• Array#some для переборе answers.

  Метод some() испытания, проходит ли какой-либо элемент в массиве тест, реализованный при условии функции.

• String#split, чтобы получить выигрышные позиции внутри строки.

  split() метод разбивает объект строки на массив строк, разделяя строку на подстроки.

• Array#every для проверки всех позиций

  В every() тестов метода, все ли элементы в массиве проходят испытание, реализованное предоставленную функцией.

• Array#indexOf для тестирования массива на предмет предмета. Элемент преобразуется в число.

  indexOf() метод возвращает первый индекс, при котором данный элемент может быть найден в массиве, или -1, если его нет.

function check(pos) { 
 
    var answers = ["1,2,3", "1,4,7", "2,5,8", "3,6,9", "4,5,6", "7,8,9", "1,5,9", "3,5,7"]; 
 
    return answers.some(function (a) { 
 
     return a.split(',').every(function (b) { 
 
      return pos.indexOf(+b) !== -1; 
 
     }); 
 
    }); 
 
} 
 

 
console.log(check([1, 3, 5])); // false 
 
console.log(check([1, 3, 5, 2])); // true

Answer 2

Каждый раз, когда игрок берет свою очередь, вы хотите, чтобы проверить выиграли ли они в течение этого хода.Это означает, что ваша структура данных должна поддерживать легкую проверку выигрыша без чрезмерной предварительной обработки. Есть несколько причин, почему строки плохо подходят для этого. Во-первых, если вы используете прямое сравнение строк, вы не можете правильно сопоставить завершенные игры, например 1,2,3,5, потому что были повороты, которые не способствовали завершению игры.

Это означает, что вы захотите рассмотреть каждый блок отдельно, разделив строку на массив и итерируя ее значения. Однако это все еще не идеально, так как вы должны разбить строку после поворота каждого игрока, хотя результирующий массив всегда будет таким же. Таким образом, вы можете просто сохранить ответы в виде массива массивов.

Тогда, как только у вас есть этот массив массивов, нужно просто проверить, что есть some ответ (то есть по крайней мере один) в этом массиве, где every одна из коробок находится в догадках игрока included.

Это приводит к довольно кратким выражением:

var answers = [ 
    [1,2,3], [1,4,7], [2,5,8], 
    [3,6,9], [4,5,6], [7,8,9], 
    [1,5,9], [3,5,7] 
]; 

function isWinningGuess(guesses) { 
    return answers.some(answer => answer.every(box => guesses.includes(box))); 
} 

Здесь guesses представляет собой массив, содержащий каждую коробку, который выбрал игрок.

Полный рабочий пример приведен ниже, а также запустить демонстрационное приложение.

var answers = [ 
 
    [1,2,3], [1,4,7], [2,5,8], 
 
    [3,6,9], [4,5,6], [7,8,9], 
 
    [1,5,9], [3,5,7] 
 
]; 
 

 
function isWinningGuess(guesses) { 
 
    return answers.some(answer => answer.every(x => guesses.includes(x))); 
 
} 
 

 
// Below code for visualization only 
 
$(function() { 
 
    var current = 0; 
 
    var players = [ 
 
    { 'symbol': 'X', 'plays': [] }, 
 
    { 'symbol' : 'O', 'plays' : [] } 
 
    ]; 
 

 
    $(".row > div").click(function() { 
 
    if ($(this).text() != '-') return; 
 
    var player = players[current]; 
 

 
    $(this).html("<span>" + player.symbol + "</span>"); 
 

 
    var row = $(this).closest('.row').index(); 
 
    var col = $(this).index(); 
 
    var boxNumber = row * 3 + col + 1; 
 
    player.plays.push(boxNumber); 
 

 
    $("#status").text("Last Move: " + player.symbol + ' chose ' + boxNumber); 
 

 
    if (isWinningGuess(player.plays)) { 
 
     $("#status").append('; ' + player.symbol + ' wins!'); 
 
     $(".row > div").off('click'); 
 
    } 
 
    
 
    current ^= 1; 
 
    }); 
 
});

.row { 
 
    height: 45px; 
 
    margin-top: 5px; 
 
} 
 

 
.row > div { 
 
    width: 45px; 
 
    height: 45px; 
 
    border: 1px solid green; 
 
    background-color: pink; 
 
    display: inline-block; 
 
    cursor: pointer; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<div id="result"></div> 
 
<div id="status">Last Move: </div> 
 

 
<div> 
 
<div class="row"> 
 
    <div>-</div> <div>-</div> <div>-</div> 
 
</div> 
 
<div class="row"> 
 
    <div>-</div> <div>-</div> <div>-</div> 
 
</div> 
 
<div class="row"> 
 
    <div>-</div> <div>-</div> <div>-</div> 
 
</div> 
 
</div>