看了一个 canvas2048 的源码,就移动方块函数这块特别的难懂,也可能是自己基础太差,有大神可帮忙解析下吗?
贴上移动方格相关的代码:
var keycom = { '38': [0, -1], '40': [0, 1], '37': [-1, 0], '39': [1, 0] }
var game = {
move: function(dir) {
//用来调整不同方向的遍历方式
// -1 0
function modify(x, y) {
tx = x, ty = y;
if (dir[0] == 0) tx = [ty, ty = tx][0];
if (dir[1] > 0) tx = 3 - tx;
if (dir[0] > 0) ty = 3 - ty;
return [tx, ty];
}
//根据移动的方向,将地图中对应行 /列中的数字一个个压入栈中,如果第一次遇到栈顶数字和待入栈数字相等,则栈顶数字乘 2,最后用栈中数字更新地图中的对应行 /列
for (var i = 0; i < 4; i++) {
var tmp = Array();
var isadd = false;
for (var j = 0; j < 4; j++) {
var ti = modify(i, j)[0],
tj = modify(i, j)[1];
if (map[ti][tj] != 0) {
if (!isadd && map[ti][tj] == tmp[tmp.length - 1]){
score += (tmp[tmp.length - 1] *= 2);
isadd = true;
space += 1;
}
else{
tmp.push(map[ti][tj]);
}
}
}
for (var j = 0; j < 4; j++) {
var ti = modify(i, j)[0],
tj = modify(i, j)[1];
map[ti][tj] = isNaN(tmp[j]) ? 0 : tmp[j];
}
}
draw.produce(); //随机产生一个方块
if (space == 0) {
alert("game over");
}
draw.block();
}
}
// 事件监听
document.onkeydown = function(e) {
dir = keycom[(e ? e : event).keyCode];
game.move(dir);
console.log(dir);
};