Создаем карточную игру "очко"

Игра "Очко". Начало. Колода карт и раздача.

Ну что же, начнем городить велосипед в очередной раз (по правде говоря, сам по себе велосипед уже практически готов, но сюда будет выкладываться постепенно полный код этой программки для того, чтобы когда-нибудь позднее сравнить, и обратить внимание на те или иные ошибки, которые будут допущены в этой работе.

Итак, об основных целях и задачах я уже писал в life рубрике в статье Компьютерная игра 04КО, так что особо распространяться об этом здесь не имеет смысла. При желании, всегда можно перейти по ссылке.

Приступим же к разбору кода и его описанию.

Логика игры О4К0

Правила этой карточной игры несколько похожи на игру Black Jack, хотя и немного отличаются. Мы знаем, что в игре предполагается обыкновенная колода карт из 36 карточек и, как минимум, 2 игрока (в нашем случае, это пользователь и некое подобие элементарного линейного ИИ)

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

Создаем колоду из 36 карт

Довольно интересной задачей будет  тренировка использования многомерных массивов. Возможно, это не столько оправдано в данном случае, нежели, скажем, ассоциативные, но я решил использовать именно этот прием.

Итак, в нашей колоде 36 карт - стандартные 4 масти. Соответственно, для создания колоды нам понадобится массив 4х9 (вертикаль х горизонталь)


Важная информацияВ JavaScript многомерный массив - это массивы в массиве. То есть, длина массива (arr.length) будет определена как количество строк. А вот длина массива в массиве (arr[i].length) - считается уже по горизонтали.

Это замечание справедливо, если заполнять массив примерно таким образом:

 

arr = [

[1,2,3,4,5],

[1,2,3,4,5]

]


Поскольку мы определились с необходимыми нам свойствами массива, потому и объявим его:

var cards = [
["J", "Q","K",6,7,8,9,10,"A"],//пики
["J", "Q","K",6,7,8,9,10,"A"],//крести
["J", "Q","K",6,7,8,9,10,"A"],//буби
["J", "Q","K",6,7,8,9,10,"A"],//черви
];

Теперь предстоит решить задачу выдачи карт игрокам. При этом, количество карт в колоде будет сокращаться.

Функция случайных чисел

"Тянуть" же карты из колоды предлагается простеньким генератором случайных чисел, который для удобства можно описать через функцию:

function getRandomyouNeed(umnoj){
return (Math.floor(Math.random()*umnoj));
};

, где umnoj - множитель (максимальное число)

Раздаем случайные карты игрокам

Поскольку в нашей игре будет 2 участника (компьютер и пользователь), озаботимся созданием еще 2х глобальных переменных-массивов, которые будут содержать в себе карты, которые вытянули игроки и их изображения.

var playercard=[]; //массив карт игрока

var compcard=[];//массив карт компьютера

var playerimage=[];

var compimg=[];

Кроме того, для функции, раздающей карты, нам понадобятся и другие переменные - выбор масти, выбор карты, выпавшая карта.

var vibormast; //выбор масти
var ncard; //номер карты

var newcard;//выпавшая карта

Начнем написание функции:

function getRandomCard(arr)
{

Cледует обратить внимание, что функция раздачи карт должна работать ТОЛЬКО до того момента, пока в колоде остались неразыгранные карты. Таким образом, сразу же получается условие if(cards.length>0). Вместе с тем, возьмем на заметку, что, как уже говорили ранее, значение cards.length в нашем случае - масти в колоде. Именно поэтому необходимо будет чистить массив от удаленных значений.

Для начала, возьмем же случайные числа, чтобы определиться с тем, какую карту из колоды мы втянем:

if (cards.length>0){
vibormast = getRandomyouNeed(cards.length);
ncard = getRandomyouNeed(cards[vibormast].length);
newcard = cards[vibormast][ncard];

vibormast=getRandomyouNeed(cards.length); - конструкция, означающая, что наша функция getRandomyouNeed будет присваивать значение переменной vibormast случайное значение от 0 до значения длины массива cards, то есть выбор будет производиться по одной из оставшихся мастей.

ncard = getRandomyouNeed(cards[vibormast].length); - соответственно, выбор производится по одной из оставшихся карт определенной масти в колоде.

newcard = cards[vibormast][ncard]; - обозначаем выпавшую карту.

 

Карту-то мы вытянули, однако ее значение до сих пор осталось в массиве cards, чего быть не должно. Удалить значение из массива можно разными способами, но мы воспользуемся методом splice (он полностью "стирает" элемент массива, не оставляя пустых значений, как, скажем, метод delete):

cards[vibormast].splice(ncard,1);

где удаляем.splice(что удаляем, сколько) - таким образом, из подмассива vibormast массива cards мы удалим значение ncard.

Однако, сейчас мы удалили только карту. Масть же vibormast останется, что для нас неприемлемо и может привести к сбоям в работе программки. Именно поэтому следует записать сюда еще одну конструкцию if, которая удаляла бы из массива закончившийся подмассив (закончившуюся масть)

if (cards[vibormast].length==0)
{cards.splice(vibormast,1)};

если длина карт масти ==0 - удалить масть.

Карту выбрали и удалили ее из колоды. Теперь следует положить ее в массив одного из игроков. Делать это очень просто - делаем push! ))

arr.push(newcard);

Карту одному из игроков добавили. Добавим же к ней изображение. Делать это можно разными способами - например, добавив еще один параметр в функцию и описав краткий код, либо же через операторы ветвления:

if (arr==playercard){playerimage.push("cards/"+newcard+""+vibormast+".jpg");}
else if(arr==compcard){compimg.push("cards/"+newcard+""+vibormast+".jpg");}

Добавляем к массиву изображений игрока адрес, где хранится файл картинки (предварительно стоит присвоить им соответствующие массиву-колоде имена.

Но и это еще не все. Рано или поздно, колода закончится - и нам придется возвращаться к вопросу - перемешивать ее заново (обновить массив cards до исходного состояния) или закончить игру!?

else if(cards.length==0){
document.getElementById("start").style.display="none";
document.getElementById("buttonmore").style.display="none";
document.getElementById('question').value = ("Колода закончилась. Перемешать?");
document.getElementById("yees").style.display="block";
}
}

Эти элементы рассмотрим позднее, когда будем собирать игрушку полностью - настраивать ее взаимодействие  с браузером. Ну а пока и все  на сегодня )