Крошечные крестики-нолики на JavaScript (30 строк кода)
Invite pending
Неделя минимализма на хабре. Популяция тридцатистрочников удвоилась.
От меня в копилку миниатюрные крестики-нолики:
Изначально хотелось сделать проверку на окончание игры с помощью рекурсии и пары условий.
Но, если играть честно (не набивать в одну строку десяток), то такой алгоритм не влезет в отведенные для него 9 строк. К тому же, я хотел сохранить переносы строк между функциями для сохранения читабельности кода.
В итоге сделал проверку через простой перебор всех вариантов (8 условий для победы/поражения, 1 для ничьи). Условие проверки получилось длинное, да и запихнул каждый блок if'а в 1 строку.
Ну и сжульничал немного, в html добавил 9 onclick'ов — по одному к каждой клетке.
Ссылки:
Fiddle, Github
От меня в копилку миниатюрные крестики-нолики:
- игрокое поле на div'ах, файл стиля и 2 картинки
- engine.js занимает 30 строк
Мой код:
var t = new Array(9);
function ai() {
var id = Math.floor(Math.random() * 9);
t[id] ? ai() : move(id, 'ai');
}
function checkEnd() {
if (t[0]=='ai' && t[1]=='ai' && t[2]=='ai' || t[0]=='player' && t[1]=='player' && t[2]=='player') return true;
if (t[3]=='ai' && t[4]=='ai' && t[5]=='ai' || t[3]=='player' && t[4]=='player' && t[5]=='player') return true;
if (t[6]=='ai' && t[7]=='ai' && t[8]=='ai' || t[6]=='player' && t[7]=='player' && t[8]=='player') return true;
if (t[0]=='ai' && t[3]=='ai' && t[6]=='ai' || t[0]=='player' && t[3]=='player' && t[6]=='player') return true;
if (t[1]=='ai' && t[4]=='ai' && t[7]=='ai' || t[1]=='player' && t[4]=='player' && t[7]=='player') return true;
if (t[2]=='ai' && t[5]=='ai' && t[8]=='ai' || t[2]=='player' && t[5]=='player' && t[8]=='player') return true;
if (t[0]=='ai' && t[4]=='ai' && t[8]=='ai' || t[0]=='player' && t[4]=='player' && t[8]=='player') return true;
if (t[2]=='ai' && t[4]=='ai' && t[6]=='ai' || t[2]=='player' && t[4]=='player' && t[6]=='player') return true;
if(t[0] && t[1] && t[2] && t[3] && t[4] && t[5] && t[6] && t[7] && t[8]) return true;
}
function move(id, role) {
if(t[id]) return false;
t[id] = role;
document.getElementById(id).className = 'cell ' + role;
!checkEnd() ? (role == 'player') ? ai() : null : reset()
}
function reset() {
alert("Игра окончена!");
location.reload();
}
Изначально хотелось сделать проверку на окончание игры с помощью рекурсии и пары условий.
Но, если играть честно (не набивать в одну строку десяток), то такой алгоритм не влезет в отведенные для него 9 строк. К тому же, я хотел сохранить переносы строк между функциями для сохранения читабельности кода.
В итоге сделал проверку через простой перебор всех вариантов (8 условий для победы/поражения, 1 для ничьи). Условие проверки получилось длинное, да и запихнул каждый блок if'а в 1 строку.
Ну и сжульничал немного, в html добавил 9 onclick'ов — по одному к каждой клетке.
Ссылки:
Fiddle, Github