<html>
<head>
<title>2048 纯数据</title>
</head>
<body>
<script>
//按F12打开控制面板查看数组变化,在控制面板之外点下然后就可以按箭头操作
var maps=[];
var temps=[];
var isCanMove=false;
var keyData={37:0,38:0,39:0,40:0,65:0,68:0,83:0,87:0};
var isPlay=true;
window.addEventListener('keydown', keyDown,true);
window.addEventListener('keyup', keyUp,true);
function init(){
for(let i=0;i<4;i++){
maps.push([]);
for(let j=0;j<4;j++){
maps[i].push({x:i,y:j,val:0});
}
}
for(let i=0;i<2;i++) createNewNode();
showData();
}
function keyDown(e){
if(!isPlay)return;
let keyCode=e.keyCode;
if(keyData.hasOwnProperty(keyCode)&&!keyData[keyCode]){
console.log('----------------------------');
keyData[keyCode]=1;
readyMove(e);
}
}
function keyUp(e){
let keyCode=e.keyCode;
if(keyData.hasOwnProperty(keyCode)&&keyData[keyCode]){
keyData[keyCode]=0;
}
}
function readyMove(e){
temps.length=0;
let j=0;
switch(e.keyCode){
case 37://左
case 65:
maps.forEach(e=>temps.push([...e]));
break;
case 39://右
case 68:
maps.forEach(e=>temps.push([...e].reverse()));
break;
case 38://上
case 87:
temps=[[],[],[],[]];
for(let i=0;i<4;i++){
for(let j=0;j<4;j++)temps[j][i]=maps[i][j];
}
break;
case 40://下
case 83:
temps=[[],[],[],[]];
for(let i=0;i<4;i++){
for(let j=0;j<4;j++)temps[j][i]=maps[3-i][j];
}
break;
}
isCanMove=false;
moveNodeAll();
if(isCanMove){
createNewNode(1);
showData();
if(!checkResult()){
isPlay=false;
setTimeout(()=>{alert('游戏结束')},500)
}
}
}
function showData(){
maps.forEach(e=>{
let s=''
e.forEach(e=>s+=`${e.x}${e.y}[ ${e.val} ]`);
console.log(s);
});
}
function moveNodeAll(){
temps.forEach(e=>moveNodeOne(e))
}
function moveNodeOne(ms){
for(let i=0;i<ms.length;i++){
if(i>=0){
let n1=ms[i];
let n2=ms[i+1];
if(n1&&n2){
if(n1.val==0&&n2.val!=0){//前面是空的
n1.val=n2.val;
n2.val=0;
isCanMove=true;
i-=2;
}else if(n1.val!=0&&n1.val==n2.val){//前面和后面一样的
n1.val+=n2.val;
n2.val=0;
isCanMove=true;
}
}
}
}
}
/**创建新节点*/
function createNewNode(t=0){
var p=getNewPoint();
if(p){
let node=maps[p.x][p.y];
node.val=2;
}
}
//得到一个新的点
function getNewPoint(){
var newArray=[];
var newPoint=[];
for(var i=0;i<4;i++){
for(var j=0;j<4;j++){
var node=maps[i][j];
if(node.val==0){
newArray.push({x:i,y:j});
}
}
}
newPoint=newArray[Math.floor(Math.random()*newArray.length)];
return newPoint;
}
/**查看结果是不是已经没有可以移动的数字了*/
function checkResult(){
var newArray;
var allArray=this.maps;
//竖直方向
for(var i=0;i<allArray.length;i++){
newArray=[];
for(var j=0;j<allArray.length;j++){
newArray.push(allArray[j][i])
}
if(this.checkRecultNewArr(newArray)){
return true;
}
}
//横直方向
for(i=0;i<allArray.length;i++){
newArray=allArray[i];
if(this.checkRecultNewArr(newArray)){
return true;
}
}
return false;
}
function checkRecultNewArr(newArray){
for(var i=0;i<newArray.length;i++){
if(newArray[i].val==0) return true;
if(i<newArray.length-1){
if(newArray[i].val==newArray[i+1].val){
return true;
}
}
}
return false;
}
init();
</script>
</body>
</html>
可以使用记事本保存代码,改后缀为.html测试。