基本信息

---

下载

   友情提示：（无需注册或充值，赞助后即可获取资源下载链接）

---

     嘿，亲！知识可是无价之宝呢，但咱这精心整理的资料也耗费了不少心血呀。小小地破费一下，绝对物超所值哦！如有下载和支付问题，请联系我们QQ(微信同号)：813200300

本次赞助数额为： 2 元　

支付宝支付

微信支付

   源码介绍

---

// [
// [2,4,8,16]
// [0,4,128,64]
// [0,0,0,0]
// []
// ]

// 定义一个对象，这个对象存储所有的数据
var game = {
	data: [], //存储游戏所有数据的数组
	score: 0, //定义一个游戏的得分
	gamerunning: 1, //定义游戏运行的状态为1
	gameover: 0, //定义游戏结束的状态为0
	status: 1, //定义一个游戏的状态，时刻的去跟上面两个状态做比较，判断目前游戏处于运行或者结束状态
	start: function() { //游戏开始的方法
		this.status = this.gamerunning; //开始的时候让状态等于游戏运行的状态
		this.score = 0; //游戏的分数清空
		this.data = [ //游戏初始化的时候所有的数据全都是0
			[0, 0, 0, 0],
			[0, 0, 0, 0],
			[0, 0, 0, 0],
			[0, 0, 0, 0]
		];
		this.randomNum();
		this.randomNum();
		this.randomNum();
		this.randomNum();
		this.randomNum();
		this.dataView();
	},
	randomNum: function() { //随机数的方法，后面每移动一次就调用一下这个方法
		for(;;) { //死循环，不停的去找数组中是0的元素
			var r = Math.floor(Math.random() * 4); //随机生成一个行
			var c = Math.floor(Math.random() * 4); //随机生成一个列
			if(this.data[r][c] == 0) {
				var num = Math.random() > 0.5 ? 2 : 4; //随机生成2或者4
				this.data[r][c] = num; //为数组去赋值
				break; //退出循环
			}
		}
	},
	dataView: function() { //视图更新的方法
		for(var r = 0; r < 4; r  ) { //循环每一行
			for(var c = 0; c < 4; c  ) { //循环每一行对应的单元格
				var div = document.getElementById("c"   r   c);
				if(this.data[r][c] == 0) { //如果数组中的内容为0的时候
					div.innerHTML = ""; //里面内容清空
					div.className = "cell";
				} else { //如果不为0的时候
					div.innerHTML = this.data[r][c]; //里面对应的视图显示数组中对应的数字
					div.className = "cell n"   this.data[r][c];
				}
			}
		};
		// 设置游戏的分数
		document.getElementById("score01").innerHTML = this.score;

		//判断游戏的状态
		if(this.status == this.gameover) {
			document.getElementById("score02").innerHTML = this.score;
			document.getElementById("gameover").style.display = 'block';
		} else {
			document.getElementById("gameover").style.display = 'none';
		}
	},
	isgameover: function() { //判断游戏是否结束的方法
		for(var r = 0; r < 4; r  ) {
			for(var c = 0; c < 4; c  ) {
				if(this.data[r][c] == 0) { //还有0的时候游戏肯定是在运行中
					return false;
				}
				if(c < 3) { //判断左右是否有相同的
					if(this.data[r][c] == this.data[r][c   1]) {
						return false;
					}
				}
				//				if(r < 3){   //判断上下是否有相同的
				//					if(this.data[r][c] == this.data[r 1][c]){
				//						return false;
				//					}
				//				}
			}
		}
		return true; //表示游戏已经gameover了
	},
	// 移动的方法(左)
	moveLeft: function() {
		// 移动之前
		var before = String(this.data);

		// 处理移动的逻辑
		for(var r = 0; r < 4; r  ) { //移动每一行
			this.moveLeftinRow(r);
		}

		// 移动之后
		var after = String(this.data);
		if(before != after) { //移动之前如果不等于移动之后肯定是发生了移动
			this.randomNum(); //生成随机数
			if(this.isgameover()) { //判断游戏是否结束
				this.status = this.gameover; //如果结束改变游戏的状态
			}
			this.dataView(); //更新视图
		}
	},
	moveLeftinRow: function(r) { //移动每一行的函数
		for(var c = 0; c < 3; c  ) {
			var nextc = this.getNextinRow(r, c);
			if(nextc != -1) { //表示已经找到了
				if(this.data[r][c] == 0) {
					this.data[r][c] = this.data[r][nextc]; //数字替换
					this.data[r][nextc] = 0 //位置清为0 	
					c--; //继续从当前位置开始循环
				} else if(this.data[r][c] == this.data[r][nextc]) {
					this.data[r][c] *= 2; //数字相加
					this.data[r][nextc] = 0; //位置清为0
					this.score  = this.data[r][c]; //更新分数 
				}
			} else { //当没有找到数字的时候
				break;
			}
		}
	},
	getNextinRow: function(r, c) { //找位置的函数
		for(var i = c   1; i < 4; i  ) {
			if(this.data[r][i] != 0) { //表示找到了位置
				return i; //找到了位置，直接把位置返回出来就可以
			}
		}
		return -1; //没有找到返回一个标识符
	},
	////右移
	moveRight: function() {
		// 移动之前
		var before = String(this.data);

		// 处理移动的逻辑
		for(var r = 0; r < 4; r  ) { //移动每一行
			this.moveRightinRow(r);
		}

		// 移动之后
		var after = String(this.data);
		if(before != after) { //移动之前如果不等于移动之后肯定是发生了移动
			this.randomNum(); //生成随机数
			if(this.isgameover()) { //判断游戏是否结束
				this.status = this.gameover; //如果结束改变游戏的状态
			}
			this.dataView(); //更新视图
		}
	},
	moveRightinRow: function(r) { //移动每一行的函数
		for(var c = 3; c >=0; c--) {
			var nextc = this.getNextinRow1(r, c);
			if(nextc != -1) { //表示已经找到了
				if(this.data[r][c] == 0) {
					this.data[r][c] = this.data[r][nextc]; //数字替换
					this.data[r][nextc] = 0 //位置清为0 	
					c  ; //继续从当前位置开始循环
				} else if(this.data[r][c] == this.data[r][nextc]) {
					this.data[r][c] *= 2; //数字相加
					this.data[r][nextc] = 0; //位置清为0
					this.score  = this.data[r][c]; //更新分数 
				}
			} else { //当没有找到数字的时候
				break;
			}
		}
	},
	getNextinRow1: function(r, c) { //找位置的函数
		for(var i = c - 1; i >=0; i--) {
			if(this.data[r][i] != 0) { //表示找到了位置
				return i; //找到了位置，直接把位置返回出来就可以
			}
		}
		return -1; //没有找到返回一个标识符
	},

//	////上移
	moveUp: function() {
		// 移动之前
		var before = String(this.data);

		// 处理移动的逻辑
		for(var c = 0; c < 4; c  ) { //移动每一行
			this.moveUpinRow(c);
		}

		// 移动之后
		var after = String(this.data);
		if(before != after) { //移动之前如果不等于移动之后肯定是发生了移动
			this.randomNum(); //生成随机数
			if(this.isgameover()) { //判断游戏是否结束
				this.status = this.gameover; //如果结束改变游戏的状态
			}
			this.dataView(); //更新视图
		}
	},
	moveUpinRow: function(c) { //移动每一行的函数
		for(var r = 0; r<4; r  ) {
			var next = this.getNextinRow2(r, c);
			if(next != -1) { //表示已经找到了
				if(this.data[r][c] == 0) {
					this.data[r][c] = this.data[next][c]; //数字替换
					this.data[next][c] = 0 //位置清为0 	
					r--; //继续从当前位置开始循环
				} else if(this.data[r][c] == this.data[next][c]) {
					this.data[r][c] *= 2; //数字相加
					this.data[next][c] = 0; //位置清为0
					this.score  = this.data[r][c]; //更新分数 
				}
			} else { //当没有找到数字的时候
				break;
			}
		}
	},
	getNextinRow2: function(r, c) { //找位置的函数
		for(var i = r   1; i < 4; i  ) {
			if(this.data[i][c] != 0) { //表示找到了位置
				return i; //找到了位置，直接把位置返回出来就可以
			}
		}
		return -1; //没有找到返回一个标识符
	},

//下移
	moveDown: function() {
		// 移动之前
		var before = String(this.data);

		// 处理移动的逻辑
		for(var c = 0; c < 4; c  ) { //移动每一行
			this.moveDowninRow(c);
		}

		// 移动之后
		var after = String(this.data);
		if(before != after) { //移动之前如果不等于移动之后肯定是发生了移动
			this.randomNum(); //生成随机数
			if(this.isgameover()) { //判断游戏是否结束
				this.status = this.gameover; //如果结束改变游戏的状态
			}
			this.dataView(); //更新视图
		}
	},
	moveDowninRow: function(c) { //移动每一行的函数
		for(var r = 3; r>=0; r--) {
			var next = this.getNextinRow3(r, c);
			if(next != -1) { //表示已经找到了
				if(this.data[r][c] == 0) {
					this.data[r][c] = this.data[next][c]; //数字替换
					this.data[next][c] = 0 //位置清为0 	
					r--; //继续从当前位置开始循环
				} else if(this.data[r][c] == this.data[next][c]) {
					this.data[r][c] *= 2; //数字相加
					this.data[next][c] = 0; //位置清为0
					this.score  = this.data[r][c]; //更新分数 
				}
			} else { //当没有找到数字的时候
				break;
			}
		}
	},
	getNextinRow3: function(r, c) { //找位置的函数
		for(var i = r - 1; i >=0; i--) {
			if(this.data[i][c] != 0) { //表示找到了位置
				return i; //找到了位置，直接把位置返回出来就可以
			}
		}
		return -1; //没有找到返回一个标识符
	}

}

game.start()
document.onkeydown = function(event) { //绑定键盘事件
	var event = event || window.event;
	console.log(event.keyCode); //每个按键对应的键盘码
	if(event.keyCode == 37) {
		game.moveLeft();
	} else if(event.keyCode == 39) {
		game.moveRight();
	} else if(event.keyCode == 38) {
		game.moveUp();
				}else{
					if(event.keyCode == 40){
				game.moveDown()
				}
	}
}

//←37	
//↑ 38
//→39
//↓ 40