JS实现人机大战之五子棋（UI篇）_技术问答

首页免费课 JS实现人机大战之五子棋（UI篇）问答

JS实现人机大战之五子棋（UI篇）

                
                程序员面试辅导
            全栈工程师

                    查看讲师更多课程 
                    程序员面试辅导讲师的其他课程
                
基于websocket的火拼俄罗斯（升级版）
中级·21259
免费课程
                                
基于websocket的火拼俄罗斯（单机版）
中级·31677
免费课程
                                
基于Websocket的火拼俄罗斯（基础）
中级·34056
免费课程
                                
Handlebars模板引擎
中级·13084
免费课程
                                
JS实现人机大战之五子棋（AI篇）
中级·43232
免费课程
                                
Velocity.js实现弹出式相框
中级·27005
免费课程
                                
                难度中级
            
                时长30分
            
                学习人数
            
综合评分9.67
                            167人评价
                        查看评价
                                9.9
                                内容实用
                            
                                9.6
                                简洁易懂
                            
                                9.5
                                逻辑清晰

全部评论问答未解决精华

月下不知十年后的八月

说的非常棒

0 3-1 案例总结

2018-03-06

流星飞亦

对于颜色bug直接把me = !me写在判断里就行了呗：
if (chessBoard[i][j] == 0) {
oneStep(i, j, me);
if (me) {
chessBoard[i][j] = 1;
me = !me;
}
else {
chessBoard[i][j] = 2;
me = !me;
}
}

0 3-1 案例总结

2018-02-24

大脸酱2673

逻辑清楚，代码简洁，很好的学习素材，谢谢老师

0 3-1 案例总结

2018-02-03

okok_anyway

老师讲得十分清楚！感谢！！！！

0 2-5 落子实现

2018-01-20

创心

很厉害，建议学完一定要学老师的俄罗斯方块，保证让你学到更多东西。

2018-01-19

慕标3118546

有没有源码

0 2-4 画棋子

2018-01-10

彩加

然而按照老师的思路写的判断完全不会出现楼下说的颜色错误的bug→_→每次落子都会把对应数组元素改为1或者2，再点击的时候根本不会执行落子或是变色的操作，怎么会出现bug的。。。。

1 3-1 案例总结

2018-01-01

慕仔2083373

加个return 就可以解决啦

0 3-1 案例总结

2017-12-21

慕仔2083373

有一个小bug 比如我执黑先下了第一颗子，然后该执白了，执白时，我不小心点了在黑子上，然后我在点其他位置，那么悲剧发生了，下的是黑子，这个判断还要在加点“料”

0 3-1 案例总结

2017-12-21

在校生

其实这个有个bug吧！当你点击已经有了黑子！你在去点一次已经点了一次的黑子！下一次出现的是黑子！并不是白子；

1 3-1 案例总结

2017-12-20

var j = Math.floor(y / 30);为什么除以30

最赞回答 / qq_几分秀_04105739

上面同学的说法不太对，不是因为方面操作吧。var x=e.offsetX;//获取的是相对于整个canvas容器的x坐标值var y=e.offsetY;//获取的是相对于整个canvas容器的y坐标值var i = Math.floor(x/30);var j = Math.floor(y/30);oneStep(i,j,me); //传入i，j值context.arc(15+i*30,15+j*30,13,0,2*Math.PI) ;//oneStep(i,j,me)里的画圆函数以上其实可以等同于...

3 回答 1485 浏览 2-5 落子实现

2017-12-16

纨绔帝皇

var i = Math.floor(x / 30);，为什么是除以30

0 2-5 落子实现

2017-12-16

生命数组后，在谷歌浏览器运行，提示out of memory。。。

最新回答 / 慕移动9910096

上代码，不上代码怎么知道

1 回答 5051 浏览 3-1 案例总结

2017-12-09

box-shadow

已采纳回答 / undarkness

-2是向上和左的偏移，内部阴影加inset。如果你是要说光线不应该是这么样，右下角有了左上角就不该有的话，那是他为了消除棋盘的纸片感偷懒用的方法，要css实现有厚度感的立体效果比较麻烦，还不如直接用图片，而且不是这讲的重点。

1 回答 1358 浏览 2-1 页面结构搭建

2017-12-01

慕圣7406815

if (chessBoard[i][j] == 0) {
oneStep(i, j, me);
if (me) {
chessBoard[i][j] = 1;
}else{
chessBoard[i][j] = 2;
}
me = !me;

}
oneStep(i, j, me);
me != me;(这里原来是me = !me,只修改这里就不用点两次变色了)

0 2-5 落子实现

2017-11-02

realwds

老师用的是Sublime~

3 2-1 页面结构搭建

2017-10-28

首页上一页 1 2 3 4 5 6 7 下一页尾页

开始学习

课程须知: 本课程是前端中级课程 1、JS基础知识 2、Canvas基础知识

老师告诉你能学到什么？: 1、canvas绘制五子棋棋盘 2、canvas绘制黑白棋子 3、五子棋交互逻辑处理

微信扫码，参与3人拼团

热搜

最近搜索清空