Как сделать крестики нолики в html
Обновлено: 04.07.2024
Я делаю игру в крестики-нолики в JavaScript. Я изложил некоторые из того, что я считаю основными строительными блоками:
Я знаю, что синтаксис моего основного цикла неверен. Почему я не могу сделать то, что написано в настоящее время? Если бы у вас был этот существующий код, какой тип настройки цикла вы бы использовали для этого? Извините, если это кажется недостаточно конкретным, я просто теряюсь в логике всего этого!
С этим существующим циклом все, что я пытаюсь сделать, это пройти и подсказать 2 пользователям 9 раз (потому что максимальное количество ходов = 9) на данный момент. Как только это сработает, я буду продолжать добавлять больше игровой логики. Почему я не могу получить приглашение прийти 9 раз? Текущий результат заключается в том, что он запрашивает меня один раз, печатает доску 9 раз и возвращает ложь после всего этого.
Это просто необходимо работать в окне терминала на данный момент тоже кстати.
2 ответа
Я изменил ваш код как можно меньше, но некоторые вещи отличаются, что я объясняю постепенно.
Это еще не полностью закончено, но потом это то, что вы можете сделать потом, и, вероятно, вы не хотели, чтобы я делал все это для вас.
Каждой процедуре отводится один лист.
На листе расположен текст процедуры с цветным выделением длинных операторов и циклов. Из коментариев операторов формируется оглавление. В приложении приведены публикации MatLab.
Программа позволяет наглядно отобразить информацию о процессе заряда.
Основная информация появляется на подгруженном аккумуляторе через некоторое время.
В приложении приведены аналоги на MatLab. Содержание диаграмм MatLab можно реализовать и здесь.
Excel Наименование листов это помещения и полки. На листе ограничиваем ячейки по конфигурации помещения. Записываем в ячейки что лежит. На листе "Список_инвер" нажимаем левый рисунок - все собирается и по алфавиту.
Наводим на нужную ячейку, нажимаем на правый рисунок и мы на листе с подсветкой что искали.
Работу с сессиями в PHP можно проиллюстрировать на несложном примере, например на игре "Крестики-нолики". В игре, исходный код которой приведён ниже, двум игрокам предлагается по очереди делать ходы, ставя на поле крестики и нолики. Выигрывает тот, кто первым наберёт 5 крестиков или ноликов в ряд.
Исходный код игры разделён на два файла: classes.php содержит объявление класса игры TicTacGame. Этот класс содержит всю игровую логику. Второй файл - index.php, который осуществляет взаимодействие с пользователем. Именно к index.php браузер пользователя будет отправлять запросы, и здесь же отображается игровое поле и выводится состояние игры:
Исходный код игры "Крестики-нолики"
Вы можете скачать исходный код примера в архиве, посмотреть текущую версию в репозитории Subversion, или взять текущую версию из репозитория:
Ограничения нашей игры
Эта реализация игры, исходный код которой вы видите выше, работает только в одном браузере. То есть, когда в игру зайдет пользователь с другого браузера или компьютера, для него на сервере будет создана своя отдельная сессия со своим экземпляром игры.Таким образом, играть можно только сидя вдвоём за одним компьютером. В этом смысле игру можно назвать "однопользовательской", поскольку разные пользователи, зашедшие на сайт, взаимодействуют не друг с другом, а только лишь со своей отдельной сесссией и данными в ней.
Чтобы сделать по-настоящему многопользовательскую игру, необходимо предусмотреть механизм взаимодействия пользователей друг с другом. Этот механизм реализуется не на основе сессий (ведь сессия хранит только данные для одного пользователя), а с использованием, например, базы данных, файлов или другого способа хранения данных, при котором разные пользователи могут получить доступ к общим данным игры.
Другой способ реализации
Эта реализация игры "Крестики-нолики" разработана, в основном, с целью ознакомления с механизмами PHP. В нашей игре информация о всех действиях пользователя передаётся на сервер, который эти действия обрабатывает. Но, поскольку мы уже знаем, что по сути такая реализация является однопользовательской, то ту же самую игру можно было бы реализовать иначе: например на JavaScript, выполняющемся только в браузере пользователя. Алгоритм игры прост настолько, что реализация на JavaScript без труда может выполняться в браузере. В этом случае отсутствовал бы расход мощности сервера на постоянные запросы от пользователей, а также расход времени на осуществление этих запросов, ведь вся обработка действий пользователя происходила бы локально, в браузере.
Модель-Вид-Контроллер
Несложно заметить, что исходный код нашей игры разделён по смыслу на несколько условных частей: класс игры TicTacGame, код-обработчик действий пользователя, а также код отображения состояния игры.
Такое разделение ответственности между частями приложения называется "архитектура Модель-Вид-Контроллер" (Model-View-Controller, MVC). Модель - это объект, над которым выполняются некоторые действия. Вид - это код (это может быть класс или даже несколько классов), отображающий состояние модели. Контроллер - код или класс, взаимодействующий с моделью и изменяющий её состояние в соответствии с командами пользователя.
В нашем примере "моделью" является экземпляр класса TicTacGame. TicTacGame содержит полное описание состояния игры: поставленные крестики и нолики, номер текущего игрока, а также информацию о том, кто победил в игре.
"Контроллер" в нашей игре - это фрагмент кода в начале файла index.php, где проверяется, какое действие вызвал пользователь. Контроллер воздействует на модель, вызывая следующий ход в игре, или создавая новую игру.
В программе, оперирующей различными типами объектов ("моделей"), могут присутствовать различные реализации контроллера и вида для каждого из типов объектов, причём здесь могут раскрыться все преимущества объектно-ориентированного подхода, когда классы вида или контроллера наследуются друг от друга.
Разделение кода на смысловые фрагменты Model-View-Controller, даже если программа совсем маленькая, как в нашем примере, значительно улучшает читаемость кода. Программа с такой организацией представляет собой не "лапшу", а чётко структурированный код, где обработкой ввода пользователя, обработкой данных и их отображением занимаются специально предназначенные для этого классы или фрагменты кода.
Пытливый читатель, недавно начавший знакомиться с PHP, вероятно, заметил блок текста в index.php, обрамлённый тегами , назначение которого неясно. Здесь объявляется стиль CSS (Cascading Style Sheet) для страницы, которую мы отображаем: перечислены правила, в соответствии с которыми некоторым элементам в HTML-документе назначаются свойства отображения. Эти свойства могут быть самыми разными: цвет текста, фона, стиль рамки, параметры расположения на странице и так далее.
Благодаря стилям CSS достигается ещё один уровень разделения ответственности: код, формирующий структуру HTML-документа, может не знать о том, как должны выглядеть элементы документа, ведь эта информация содержится в CSS. И наоборот, один и тот же фрагмент HTML может быть оформлен по-разному, достаточно лишь поменять стили в CSS.
Возможности СSS - тема достаточно интересная, но парой абзацев её не охватить, поэтому не будем углубляться в неё сейчас, а лучше осветим в отдельной главе.
Довольно странный вариант игры. Мне хотелось понять как ещё можно сымитировать игровую логику.
Правда, без капельки JS всё-же не обошлось: я не обнаружила способ сбрасывать игру и возложила это на JS. Если попытаться обойтись совсем без него, можно было бы просто перегружать страницу.
Результат игры обрабатывается с помощью CSS. Игра заканчивается при однозначном выигрыше либо при ничьей и полностью заполненном поле.
Теоретически можно было бы учитывать ничью до заполнения поля, это возможно, но код будет совсем длинным, так что я отказалась от этой затеи.
Ещё следовало бы сделать плавным появление панели с результатом, но у меня не получилось совладать с поведением псевдоэлементов. Анимировались некоторые свойства, которые точно об этом никто не просил, например text-indent . Для более аккуратной анимации проишлось бы увеличить код на две трети, или я просто не сообразила как это можно решить изящнее.
Я думаю, этот способ можно использовать и для полей побольше, хотя в этом случае селекторы будут километровыми, и без препроцессоров уже точно не обойтись не получится.
Читайте также: