JavaScript写的一个带AI的井字棋
最近有一门课结束了,需要做一个井字棋的游戏,我用JavaScript写了一个。首先界面应该问题不大,用html稍微写一下就可以。主要是人机对弈时的ai算法,如何使电脑方聪明起来,是值得思考一下的。开始游戏后,由玩家先行。那么站在计算机的角度,可以对多种情况进行分析,并按照重要程度赋予权值。
情况如下:
1、同一排(行。列。对角线)有且只有两个棋子,并且都是自己的,只要再进一步就能获胜,那么剩下的那个位置权值最高,优先级最大。赋予一级权值。
2、同一排(行。列。对角线)有且只有两个棋子,并且都是对方的(也就是玩家的),只要再进一步,玩家就会成功,所以“我”要堵住,剩下的那个位置赋予二级权值。
3、因为电脑方后行,如果聪明点,需要一直堵玩家方,所以当一排只有一个棋,且是玩家的棋子,那么该排其他位置的权值设为三级。
4、四级权值:一排只有己方(电脑方)的棋子。
5、五级权限:同排没有棋子,包括对方和己方。
实现的时候,每个位置的棋子,可以用二维数组full表示,每个位置的权值大小也用一个二维数组val来表示。玩家方下完后,调用AI方的函数,AI方行棋前,先更新一下权值,然后选出权值最大的位置落子(最优解)。无论是ai还是玩家方,每次落子后都要判断有没有产生输赢。用alert()函数输出结果。
为了表示权值的大小,规定按照一级到五级顺序,依次加 10000、1000、10、5、3
注:由于可能要提交源码,我没有分离出css样式和js文件,不过最好还是分开写更规范。如有不足之处,欢迎批评指正。
源码如下:
<html>
<head>
<meta charset="utf-8">
<title>井字棋</title>
<script>
//定义全局变量
var full=[[0,0,0],[0,0,0],[0,0,0]];//0表示null,1表示我下的,2表示电脑下的
var val=[[1,1,1],[1,1,1],[1,1,1]];//表示每个位置的权值
function judge(){
//检测是否有人赢
//行
for(var i=0;i<3;i++){
if(full[i][0]==full[i][1]&&full[i][1]==full[i][2]&&full[i][0]!=0){
if(full[i][0]==1){
window.alert("you win!");
return true;
}
else {
window.alert("you lose");
return true;
}
}
}
//列
for(var i=0;i<3;i++){
if(full[0][i]==full[1][i]&&full[1][i]==full[2][i]&&full[0][i]!=0){
if(full[0][i]==1){
window.alert("you win!");
return true;
}
else {
window.alert("you lose");
return true;
}
}
}
//主对角线
if(full[0][0]==full[1][1]&&full[1][1]==full[2][2]&&full[0][0]!=0){
if(full[0][0]==1){
window.alert("you win!");
return true;
}
else {
window.alert("you lose");
return true;
}
}
if(full[0][2]==full[1][1]&&full[2][0]==full[1][1]&&full[0][2]!=0){
if(full[0][2]==1){
window.alert("you win!");
return true;
}
else {
window.alert("you lose");
return true;
}
}
for(var i=0;i<3;i++){
for(var j=0;j<3;j++){
if(full[i][j]==0)
return false;//说明还没结束
if(i==2&&j==2)
{window.alert("平局!");
return true;
}
}
}
return false;//无结果
}
function bn(i,j){
//如果已经下过,则无效
if(full[i][j]!=0){
return 0;
}else{
//没下过
full[i][j]=1;
num1=(i*3+j+1)+"";
document.getElementById(num1).value="X";
if(judge()==true){
return;
}
ai();//切换
}
}
//重置权值:
function resetValue(){ for(var i=0;i<3;i++){
for(var j=0;j<3;j++){
if(full[i][j]!=0)
val[i][j]=0;
else{
//看行和列:
//最高权值
if(((full[0][j]+full[1][j]+full[2][j])==4)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==-1)
val[i][j]=val[i][j]+10000;
if(((full[i][0]+full[i][1]+full[i][2])==4)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==-1)
val[i][j]=val[i][j]+10000;
//次级权值
if(((full[0][j]+full[1][j]+full[2][j])==2)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==0)
val[i][j]=val[i][j]+1000;
if(((full[i][0]+full[i][1]+full[i][2])==2)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==0)
val[i][j]=val[i][j]+1000;
//三级权值(一排只有一个X)
if(((full[0][j]+full[1][j]+full[2][j])==1)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==0)
val[i][j]=val[i][j]+10;
if(((full[i][0]+full[i][1]+full[i][2])==1)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==0)
val[i][j]=val[i][j]+10;
//四级权值(一排只有一个O)
if(((full[0][j]+full[1][j]+full[2][j])==2)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==1)
val[i][j]=val[i][j]+5;
if(((full[i][0]+full[i][1]+full[i][2])==2)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==1)
val[i][j]=val[i][j]+5;
//五级权限(该行没有X或O)
if(((full[0][j]+full[1][j]+full[2][j])==0)&&(full[0][j]*full[1][j]*full[2][j])==0
&&((full[0][j]-1)*(full[1][j]-1)*(full[2][j]-1))==-1)
val[i][j]=val[i][j]+2;
if(((full[i][0]+full[i][1]+full[i][2])==0)&&(full[i][0]*full[i][1]*full[i][2])==0
&&((full[i][0]-1)*(full[i][1]-1)*(full[i][2]-1))==-1)
val[i][j]=val[i][j]+2; //主对角线:同上
if((i==0&&j==0)||(i==2&&j==2)||(i==1&&j==1)){
if(((full[0][0]+full[1][1]+full[2][2])==4)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==-1)
val[i][j]=val[i][j]+10000; //次级权值
if(((full[0][0]+full[1][1]+full[2][2])==2)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==0)
val[i][j]=val[i][j]+1000; //三级权值(一排只有一个X)
if(((full[0][0]+full[1][1]+full[2][2])==1)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==0)
val[i][j]=val[i][j]+10; //四级权值(一排只有一个O)
if(((full[0][0]+full[1][1]+full[2][2])==2)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==1)
val[i][j]=val[i][j]+5; //五级权值(该行没有X或O)
if(((full[0][0]+full[1][1]+full[2][2])==0)&&(full[0][0]*full[1][1]*full[2][2])==0
&&((full[0][0]-1)*(full[1][1]-1)*(full[2][2]-1))==-1)
val[i][j]=val[i][j]+2;
}
//副对角线(同上)
if((i==0&&j==2)||(i==2&&j==0)||(i==1&&j==1)){
//一级
if(((full[0][2]+full[1][1]+full[2][0])==4)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==-1)
val[i][j]=val[i][j]+10000;
//二级
if(((full[0][2]+full[1][1]+full[2][0])==2)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==0)
val[i][j]=val[i][j]+1000;
//三级权值(一排只有一个X)
if(((full[0][2]+full[1][1]+full[2][0])==1)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==0)
val[i][j]=val[i][j]+10;
//四级权值(一排只有一个O)
if(((full[0][2]+full[1][1]+full[2][0])==2)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==1)
val[i][j]=val[i][j]+5;
//五级权值(该行没有X或O)
if(((full[0][2]+full[1][1]+full[2][0])==0)&&(full[0][2]*full[1][1]*full[2][0])==0
&&((full[0][2]-1)*(full[1][1]-1)*(full[2][0]-1))==-1)
val[i][j]=val[i][j]+2;
}
}
}
}
}
function ai(){
if(judge()==true){
return;
}
//挑选权值最大的
resetValue();
var mi=0,mj=0,temp=0;
for(var i=0;i<3;i++)
for(var j=0;j<3;j++){
if(val[i][j]>temp){
temp=val[i][j];
mi=i;
mj=j;
}
}
full[mi][mj]=2;
num1=(mi*3+mj+1)+"";
document.getElementById(num1).value="O";
if(judge()==true){
return;
}
}
function lose(){
window.alert("you lose");
location.reload();
}
</script>
</head>
<body>
<h1 align=center> 井字棋</h1>
<table border=2px bordercolor="blue"width="300"height="300" style="font-size:50 " align=center>
<tr>
<td><input type="button" id="1" Style="width:100px;height:100px;" value=" " onclick="bn(0,0)"/></td>
<td><input type="button" id="2" Style="width:100px;height:100px;" value=" " onclick="bn(0,1)"/></td>
<td><input type="button" id="3" Style="width:100px;height:100px;" value=" " onclick="bn(0,2)"/></td>
</tr>
<tr>
<td><input type="button" id="4" Style="width:100px;height:100px;" value=" " onclick="bn(1,0)"/></td>
<td><input type="button" id="5" Style="width:100px;height:100px;" value=" " onclick="bn(1,1)"/></td>
<td><input type="button" id="6" Style="width:100px;height:100px;" value=" " onclick="bn(1,2)"/></td>
</tr>
<tr >
<td><input type="button" id="7" Style="width:100px;height:100px;" value=" " onclick="bn(2,0)"/></td>
<td><input type="button" id="8" Style="width:100px;height:100px;" value=" " onclick="bn(2,1)"/></td>
<td><input type="button" id="9" Style="width:100px;height:100px;" value=" " onclick="bn(2,2)"/></td>
</tr>
</table>
<div ><input type="button" style="position:relative;left:500px;top:5px;width:100px;height:50px;" value="重新开始" onclick="location.reload() "/>
<input type="button" style="position:relative;left:550px;top:5px;width:100px;height:50px;" value="认 输" onclick="lose()"/>
</div>
<body>
</html>
JavaScript写的一个带AI的井字棋的更多相关文章
- 井字棋小游戏(C语言)
最近沉迷于<NetHack>.<DCSS>等字符游戏,对其很感兴趣,于是用C语言写了个字符界面的井字棋小游戏.欢迎大家指教. 编写时遇到了一些问题,我原先准备用循环,直到读取到 ...
- Pascal小游戏 井字棋
一个很经典的井字棋游戏 Pascal源码Chaobs奉上 注意:1.有的FP版本不支持汉语,将会出现乱码.2.别想赢电脑了,平手不错了. 井字过三关: program TicTacToe; uses ...
- 用C语言实现井字棋(人人/AI人机)--完结版
目录 用C语言实现井字棋(人人/AI人机)--完结版 BUG与优化3: 1. 修改了step的计算方法,每个玩家玩完就加一次step 2. 改变了电脑下棋的逻辑,每个玩家玩完之后都跳过这次循环 源码: ...
- quick cocos2d-x 入门---井字棋
学习quick cocos2d-x 第二天 ,使用quick-x 做了一个井字棋游戏 . 我假设读者已经 http://wiki.quick-x.com/doku.php?id=zh_cn阅读了这个链 ...
- 井字棋(Tic-Tac-Toe)
井字棋介绍:https://en.wikipedia.org/wiki/Tic-tac-toe 井字棋简单,但是获胜策略却和直觉不同,四角比中间重要性要高,而且先手有很大的获胜概率获胜(先手胜:91, ...
- python 井字棋(Tic Tac Toe)
说明 用python实现了井字棋,整个框架是本人自己构思的,自认为比较满意.另外,90%+的代码也是本人逐字逐句敲的. minimax算法还没完全理解,所以参考了这里的代码,并作了修改. 特点 可以选 ...
- 使用 Vue.js 改写 React 的官方教程井字棋
React 的官方教程井字棋很好的引导初学者一步步走进 React 的世界,我想类似的教程对 Vue.js 的初学者应该也会有启发,于是使用 Vue.js 进行了改写 可以先查看最终的结果,尝试点击体 ...
- [游戏学习22] MFC 井字棋 双人对战
>_<:太多啦,感觉用英语说的太慢啦,没想到一年做的东西竟然这么多.....接下来要加速啦! >_<:注意这里必须用MFC和前面的Win32不一样啦! >_<:这也 ...
- TicTacToe井字棋 by reinforcement learning
对于初学强化学习的同学,数学公式也看不太懂, 一定希望有一些简单明了的代码实现加强对入门强化学习的直觉认识,这是一篇初级入门代码, 希望能对你们开始学习强化学习起到基本的作用. 井字棋具体玩法参考百度 ...
随机推荐
- Grunt中批量无损压缩图片插件--grunt-sprite
这是什么 这是一个帮助前端开发工程师将css代码中的切片合并成雪碧图的工具,它的主要功能是: 使用二叉树排列算法,对css文件进行处理,收集切片序列,生成雪碧图 在原css代码中为切片添加backgr ...
- Css中路径data:image/png;base64的用法详解 (转载)
大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: background-image:url(data:image/png;base64, iVBORw0KGg ...
- Python书单
gitbook.jb51 1.Python基础教程 2.流畅的Python:总有论坛的人吐槽它翻译的还是不太友好,其实真正的差别没有那么大,重要的还是有所收获 3.<Python进阶>译本 ...
- DBUtils连接池,websocket
1.mysql数据库连接池 概念:数据库连接池(Connection pooling)是程序启动时建立足够的数据库连接,并将这些连接组成一个连接池,由程序动态地对池中的连接进行申请,使用,释放. 这样 ...
- 闭包和let块级作用域
还是先从一个题目开始: 写一个隔1s输出数组的一项的函数. 如果可以用ES6语法,则可以这么写: function print (arr) { for (let i = 0; i < arr.l ...
- oracle中的事务
事务 概述:通过sql 对数据库进行操作时,同时执行成功或失败,且数据完整性一致. 链接到oracle的用户(例如plsql或sqlplus)会形成一个session, 此时对数据库的更新操作,不会 ...
- mysql update 子查询锁表问题
mysql在Update带有子查询的时候,子查询的表会锁住,导致该表无法使用.比如 update A set comments = (select count(1) from B where id = ...
- chromium之message_pump_default
看看头文件,默认的消息泵,该类实现了MessagePump的四个接口 class MessagePumpDefault : public MessagePump { public: MessagePu ...
- flask日志
日志功能的实现 Python 自身提供了一个用于记录日志的标准库模块:logging. logging 模块 logging 模块定义的函数和类为应用程序和库的开发实现了一个灵活的事件日志系统 log ...
- 树莓派编译程序时报错:virtual memory exhausted: Cannot allocate memory
一.原因分析: 树莓派内存太小,编译程序会出现virtual memory exhausted: Cannot allocate memory的问题,可以用swap扩展内存的方法. 二.解决方法: 安 ...