280行代码：Javascript写的2048游戏
7,296 views
0
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;
-
}
-
}
-
}
3.显示
显示部分CSS来源 2048源作者程序。
显示代码：
-
function display_div ()
-
{
-
var i,j;
-
var
n
=
"#d"
;
-
for (
i
=
0
;i
<
4
;i++)
-
{
-
for(
j
=
0
;j
<
4
;j++)
-
{
-
if (a[i][j] !=0)
-
$(n+(i*4+j)).html("
<
div
class
=
'tile tile-"+a[i][j]+"'
>
<
div
class
=
'tile-inner'
>
"+a[i][j]+"
</
div
>
</
div
>
");
-
else
-
$(n+(i*4+j)).html("");
-
-
-
}
-
}
-
}
这段代码是把数组内容显示到 4x4表格内。
版权所有: 本文系米扑博客原创、转载、摘录，或修订后发表，最后更新于 2014-05-31 08:36:27
侵权处理: 本个人博客，不盈利，若侵犯了您的作品权，请联系博主删除，莫恶意，索钱财，感谢！