280行代码:Javascript 写的2048游戏
2048 原作者就是用Js写的,一直想尝试,但久久未动手。
昨天教学生学习JS代码。最好还是就做个有趣的游戏好了。2048这么火,是一个不错的选择。
思路:
1. 数组 ,2维数组4x4
2. 移动算法,移动后有数字的对齐,无数字(我用的0,但不显示)补齐。
移动前


移动后(注意程序合并了第一行2个2,并产生了新的2)
移动算法分2步:
第一步骤:移动
第二步骤:合并
移动代码參考:
- function left(t,i)
- {
- var j;
- var len = t[i].length;
- for (j=0;j<len-1;j++)
- {
- if (t[i][j] == 0 && t[i][j+1] != 0)
- {
- temp = t[i][j];
- t[i][j] = t[i][j+1];
- t[i][j+1] = temp;
- left(t,i);
- }
- }
- }
合并代码參考:
- function lcombine(a,i)
- {
- var len = a[i].length;
- for(var j=0;j<len-2;j++)
- {
- if (a[i][j] == a[i][j+1])
- {
- a[i][j] *=2;
- a[i][j+1] = 0;
- left(a,i);
- break;
- }
- }
- }
;i < 4 ;i++)
这段代码是把数组内容显示到 4x4表格内。
源码及在线演示:http://jsbin.com/biximuho/6/edit
280行代码:Javascript 写的2048游戏的更多相关文章
- 用javascript实现一个2048游戏
早就想自己写一个2048游戏了,昨晚闲着没事,终于写了一个 如下图,按方向键开始玩吧. 如果觉得操作不方便,请直接打开链接玩吧: http://gujianbo.1kapp.com/2048/2048 ...
- 3行代码,为QQ轻游戏加上语音互动能力
欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由腾讯游戏云 发表于云+社区专栏 游戏和社交往往有着密不可分的关系,QQ轻游戏就是一款集成在手Q里面的游戏平台,直接通过手Q入口就能随开 ...
- 60行代码:Javascript 写的俄罗斯方块游戏
哈哈这个实在是有点意思 备受打击当初用java各种类写的都要几百行啦 先看效果图: 游戏结束图: javascript实现源码: [javascript] view plaincopyprint? & ...
- JavaScript写一个拼图游戏
拼图游戏的代码400行, 有点多了, 在线DEMO的地址是:打开: 因为使用canvas,所以某些浏览器是不支持的: you know: 为什么要用canvas(⊙o⊙)? 因为图片是一整张jpg或 ...
- javascript写贪吃蛇游戏(20行代码!)
<!doctype html> <html> <body> <canvas id="can" width="400" ...
- 纯JS写的2048游戏,分享之
这几天玩儿着2048这个游戏,突然心血来潮想练习下敲代码的思路.于是乎就模仿做了一个,到眼下位置还没有实现动态移动,不是非常好看,只是玩儿着自己模仿的小游戏还是蛮爽的,哈哈 假设没有玩儿过这个游戏,最 ...
- 1000行代码徒手写正则表达式引擎【1】--JAVA中正则表达式的使用
简介: 本文是系列博客的第一篇,主要讲解和分析正则表达式规则以及JAVA中原生正则表达式引擎的使用.在后续的文章中会涉及基于NFA的正则表达式引擎内部的工作原理,并在此基础上用1000行左右的JAVA ...
- Git命令行和Xcode结合使用(我来告诉你这行代码谁写的)
现在一直使用Git来管理代码,对于有强迫症的我来说,依旧选择了命令行,下面这段话可以更好的解释我为什么喜欢使用终端敲命令. There are a lot of different ways to u ...
- 25.Qt Quick QML-500行代码实现"合成大西瓜游戏"
"合成大西瓜"这个游戏在年前很火热,还上过微博热搜,最近便玩了一阵还挺有意思的,所以研究了一下小球碰撞原理,自己亲自手写碰撞算法来实现一个合成大西瓜游戏.并支持任意大小布局,你想玩 ...
随机推荐
- logcat错误日志
http://www.crifan.com/android_log_to_file/ http://www.iteye.com/problems/85431 http://www.cnblogs.co ...
- delphi 操作 TWebBrowser 实现自动填表(JQuery脚本与 OleVariant 方法)
版本:DELPHI XE8 操作交通银行信用卡申请表单(2016-03-23),网址如下: https://creditcardapp.bankcomm.com/applynew/front/appl ...
- Office OpenXML-Excel(一)
原文 http://www.cnblogs.com/changminglong/articles/2840004.html 适用于 2007 Microsoft Office 套件,Microsoft ...
- jquery 事件委托三种事件绑定方式.bind(),.live(),.delegate()
http://www.ituring.com.cn/article/467# http://www.cnblogs.com/lvdabao/archive/2013/08/30/3290603.htm ...
- CSS 注意事项
使用css缩写 使用缩写可以帮助减少你CSS文件的大小,更加容易阅读. 明确定义单位,除非值为0 忘记定义尺寸的单位是CSS新手普遍的错误.在HTML中你可以只写width="100&q ...
- iostat,mpstat,sar即时查看工具,sar累计查看工具
iostat,mpstat,sar即时查看工具,sar累计查看工具
- 消息提示demo
我们做网站,经常会遇到消息提示. 我仿照腾讯的邮箱做了个小demo. 提示出现后,几秒消失.提示的位置是固定的.不受布局的影响. 效果如下: 提示通常分两种,一种使错误提示,一种是成功提示.用不同的c ...
- xmpp总结
1. 浅谈对于XMPP协议自己的看法以及对其理解 http://blog.sina.com.cn/s/blog_69f68f880102uyeg.html 2. XMPP协议学习笔记一 http:// ...
- Hadoop 5、HDFS HA 和 YARN
Hadoop 2.0 产生的背景Hadoop 1.0 中HDFS和MapReduce存在高可用和扩展方面的问题 HDFS存在的问题 NameNode单点故障,难以用于在线场景 NameNode压力过大 ...
- OC基础6:多态、动态类型和动态绑定
"OC基础"这个分类的文章是我在自学Stephen G.Kochan的<Objective-C程序设计第6版>过程中的笔记. 1.关于SEL类型的数据: (1).SEL ...
