`
madbluesky
  • 浏览: 84057 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

花了半天多时间写了个简陋版的贪吃蛇,哈哈,

阅读更多
最近比较长一段时间都在学习js,也不知道自己学的怎么样,借这个游戏练练手,第一次写,虽然非常简陋,但还算能玩,小小满足一下继续努力,hoho!

<head>
<meta content-type="text/html;charset=utf-8"/>
<script >
Game = {
	BlockWidth : 20,
	GameState :"pause",
	Map : {
		init : function(left,top,width,height,foodNum){
			this.food = [];
			this.foodNum = foodNum;
			this.left = left;
			this.top = top;
			this.width = width;
			this.height = height;
			this.instance = document.createElement("div");
			this.instance.setAttribute("id","map");
			this.instance.style.offsetLeft = left;
			this.instance.style.offsetTop = top;
			//this.instance.style.offsetWidth = width;
			//this.instance.style.offsetHeight = height;
			this.instance.style.width = width;
			this.instance.style.height = height;
			this.instance.style.backgroundColor = "gray";
			document.getElementById("adiv").appendChild(this.instance);
		},
		createOrRefreshFood: function(){
			var foodPosLeft,foodPosTop;
			for(var i=0;i<this.foodNum;i++){
				if(!this.food[i]){
					this.food[i] = Game.Food.create(Game.BlockWidth,Game.BlockWidth,"red");
					this.instance.appendChild(this.food[i]);
				}
				foodPosLeft = 0.5*(0.75+Math.random())*this.width + this.left;
				foodPosTop = 0.5*(0.75+Math.random())*this.height + this.top;
				this.food[i].style.left = foodPosLeft;
				this.food[i].style.top = foodPosTop;
			}
		}
	},
	Food : {
		create : function(width,height,color){
					this.width = width;
					this.height = height;
					this.color = color;
					this.instance = document.createElement("div");
					this.instance.style.position = "absolute";
					this.instance.style.zIndex = "9";
					this.instance.style.width = width;
					this.instance.style.height = height;
					this.instance.style.backgroundColor = color;
					return this.instance;
				}
	},
	Snack : {
		init: function(foodNum){
			this.foodNum = foodNum;
			this.foodNumOfEat = 0;
			this.instance = [];
			this.derect = -1; // -1 = left,1=right,-2=up,2=down
			this.instance[0] = document.createElement("div");
			this.instance[0].style.position = "absolute";
			this.instance[0].style.backgroundColor = "black";
			this.instance[0].style.zIndex = "9";
			this.instance[0].style.width = Game.BlockWidth;
			this.instance[0].style.height = Game.BlockWidth;
			this.instance[0].style.left = 200;
			this.instance[0].style.top = 200;
			this.tail = null;
			this.instance[0].style.border = "2px  solid   white";
			Game.Map.instance.appendChild(this.instance[0]);
			for(var i=1;i<foodNum;i++){
				this.instance[i] = this.instance[0].cloneNode(true);
				this.instance[i].style.width = Game.BlockWidth;
				this.instance[i].style.height = Game.BlockWidth;
				this.instance[i].style.left = (parseInt(this.instance[i-1].style.left)+ Game.BlockWidth);
				this.instance[i].style.top = 200;
				this.instance[i].style.backgroundColor = "black";
				this.instance[i].style.border = "2px  solid   white";
				//this.instance[i].style.borderColor = "red";
				Game.Map.instance.appendChild(this.instance[i]);
			}
		},
		move:function(derect){
			if(derect + this.derect!=0){
				this.derect = derect;
			}
			var head = {};
			head.left = parseInt(this.instance[0].style.left);
			head.top = parseInt(this.instance[0].style.top);
			switch (this.derect){
					case -1:{ 
						this.instance[0].style.left = parseInt(this.instance[0].style.left)-Game.BlockWidth;
						break;
						}
					case 1:{
						this.instance[0].style.left = parseInt(this.instance[0].style.left)+Game.BlockWidth;
						break;
					}
					case -2:{
						this.instance[0].style.top = parseInt(this.instance[0].style.top)-Game.BlockWidth;
						break;
					}
					case 2:{
						this.instance[0].style.top = parseInt(this.instance[0].style.top)+Game.BlockWidth;
						break;
					}
				}
			if(this.tail!=null){
					this.foodNum++;
			}
			if(this.foodNum>1){
				for(var i=this.foodNum-1;i>1;i--){
					this.instance[i].style.left = this.instance[i-1].style.left;
					this.instance[i].style.top = this.instance[i-1].style.top;
				}
				if(this.tail!=null){
					Game.Map.instance.appendChild(this.tail);
					this.tail = null;
				}
				this.instance[1].style.left = head.left;
				this.instance[1].style.top = head.top;
			}
			if(this.isFull()){
				clearInterval(Game.timing);
				alert("you win!");
			}else if(this.isDead()){
				clearInterval(Game.timing);
				window.onkeydown = null;
				alert("you fail");
			}else{
				this.eat();
			}
		},
		eat : function(){
			var map = Game.Map;
			var head = this.instance[0];
			for(var i=0;i<map.food.length;i++){
				if(Math.abs(parseInt(this.instance[0].style.left)-parseInt(map.food[i].style.left))<=15 
					&& Math.abs(parseInt(this.instance[0].style.top)-parseInt(map.food[i].style.top))<=15) {
					//alert("eat!");
					this.tail = this.instance[this.instance.length] = this.instance[0].cloneNode(true);	
					var foodEated = map.food[i];
					for(var j=i+1;j<map.food.length;j++){
						map.food[j-1] = map.food[j];
					}
					map.food.length--;
					foodEated.parentNode.removeChild(foodEated);
					this.foodNumOfEat++;
					break;
				}
			}
			if(map.food.length<=0){
				map.createOrRefreshFood(map.foodNum);
			}
		},
		isFull : function(){
			//alert(this.foodNumOfEat);
			return this.foodNumOfEat >= 15;
		},
		isDead : function(){
			var map = Game.Map;
			if(
				parseInt(this.instance[0].style.left) <= map.left 
				|| parseInt(this.instance[0].style.left) >= (map.left+map.width)
				|| parseInt(this.instance[0].style.top) <= map.top 
				|| parseInt(this.instance[0].style.top) >= (map.top + map.height) ) {
				return true;
				}
			for(var i=1;i<this.foodNum;i++){
				if(this.instance[0].style.left == this.instance[i].style.left 
					&& this.instance[0].style.top == this.instance[i].style.top){
						return true;	
					}
			}
		}
	},
	GameStart :function(){
		this.Map.init(0,0,1000,600,1);
		this.Map.createOrRefreshFood();
		this.Snack.init(6);
		var gameItsSelf = this;
		//if(!window.onkeydown){
		//	window.onkeydown = document.body.onkeydown;
		//}
		//alert(document.body.onkeydown);
		window.onkeydown = document.body.onkeydown = function(event){
			event = window.event||event;
			var keyCode = event.keyCode;
			//alert(keyCode);
			if(keyCode==32){
				if(Game.GameState=="pause"){
					Game.GameState = "alive";
					window.clearInterval(Game.timing);
					Game.timing = window.setInterval(bindParamsToFun(Game.Snack,Game.Snack.move,Game.Snack.derect),100);
				}else{
					Game.GameState = "pause";
					window.clearInterval(Game.timing);
				}
			}else if(Game.GameState =="alive"){
				var tempDirect = Game.rederect;
				switch (keyCode) {
					case 37:{
						tempDirect = -1;
						window.clearInterval(Game.timing);
						Game.timing = window.setInterval(bindParamsToFun(Game.Snack,Game.Snack.move,tempDirect),100)
						break;
						}
					case 38:{
						tempDirect = -2;
						window.clearInterval(Game.timing);
						Game.timing = window.setInterval(bindParamsToFun(Game.Snack,Game.Snack.move,tempDirect),100)
						break;
						}
					case 39:{
						tempDirect = 1;
						window.clearInterval(Game.timing);
						Game.timing = window.setInterval(bindParamsToFun(Game.Snack,Game.Snack.move,tempDirect),100)
						break;
						}
					case 40: {
						tempDirect = 2;
						window.clearInterval(Game.timing);
						Game.timing = window.setInterval(bindParamsToFun(Game.Snack,Game.Snack.move,tempDirect),100)
						break;
						}
					default :
						break;
				}
			}
		}
	}
}
function bindParamsToFun(obj,fun){ 
	var args = Array.prototype.slice.call(arguments).slice(2); 
	return function(){ 
	fun.apply(obj,args); 
	}; 
}
window.onload = function(){
	Game.GameStart();
	}
//window.onload = function(){
//	alert(document.getElementById("theBody"));
//}
</script>
</head>
<body id="theBody">
	<div id="adiv" width="1000" height="1000"></div>
</body>
0
0
分享到:
评论

相关推荐

    Win32简陋版贪吃蛇

    【Win32简陋版贪吃蛇】是一个基于Windows 32位API开发的简易版经典游戏——贪吃蛇。这款游戏通常用C++语言编写,利用Windows编程接口来实现图形界面和用户交互。在Win32 API中,开发者可以调用一系列函数来创建窗口...

    一个简陋的贪吃蛇

    贪吃蛇代码,没写注释,但是程序的函数名可以很容易知道是什么意思

    WPF实现简陋版贪吃蛇

    在本文中,我们将深入探讨如何使用Windows Presentation Foundation (WPF) 技术,结合C#编程语言,实现一个简陋版的贪吃蛇游戏。WPF是.NET Framework的一部分,为构建具有丰富用户界面的桌面应用程序提供了强大的...

    自己写的一个贪吃蛇小程序

    自己用java写的一个贪吃蛇小程序,100来行代码,简单易懂~~~学习java的可以用来做个很好的参考~~~

    C#写的贪吃蛇游戏贪吃蛇游戏!

    在本项目中,我们讨论的是一个使用C#编程语言实现的经典小游戏——贪吃蛇。贪吃蛇游戏是一款风靡全球的简单却极具挑战性的游戏,它最初出现在早期的电子设备上,现在则被广泛移植到各种平台,包括PC、移动设备和网页...

    网络版贪吃蛇(java)

    【网络版贪吃蛇(Java)】是一款基于Java编程语言实现的在线多人游戏,它将经典的游戏模式——贪吃蛇,与现代网络技术相结合,使得玩家可以通过互联网进行实时对战。这款程序的核心特点在于它的多线程处理和Java ...

    jQuery贪吃蛇网页版游戏代码

    jQuery贪吃蛇网页版游戏代码,贪吃蛇网页版游戏代码基于jquery.1.11.3.min.js制作,贪吃蛇游戏是一款经典的益智游戏,有PC和手机等多平台版本,既简单又耐玩.Query网页版贪吃蛇游戏,带得分排行榜,交互的贪吃蛇游戏...

    一个java版的贪吃蛇游戏.zip

    一个java版的贪吃蛇游戏.zip一个java版的贪吃蛇游戏.zip一个java版的贪吃蛇游戏.zip 一个java版的贪吃蛇游戏.zip一个java版的贪吃蛇游戏.zip一个java版的贪吃蛇游戏.zip 一个java版的贪吃蛇游戏.zip一个java版的...

    双人版贪吃蛇 mfc

    通过这个双人版贪吃蛇游戏,我们可以学习到MFC如何创建窗口、处理用户输入、绘制图形、实现多线程(以便两位玩家同时操作)以及分数系统的设计等C++编程技巧。同时,游戏的逻辑和算法也是软件工程中常见的问题解决...

    QT版贪吃蛇(升级版)

    QT版贪吃蛇是一款基于Qt框架开发的经典游戏,它的核心在于使用C++语言与Qt库进行编程,将贪吃蛇游戏的功能实现并封装为一个独立的类。在这款升级版中,开发者已经优化了代码结构,使得游戏的生成、设置和运行更加...

    贪吃蛇简易版代码C++.txt

    贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易版代码C++贪吃蛇简易...

    Java版贪吃蛇游戏.zip

    Java版贪吃蛇游戏.zipJava版贪吃蛇游戏.zipJava版贪吃蛇游戏.zip Java版贪吃蛇游戏.zipJava版贪吃蛇游戏.zipJava版贪吃蛇游戏.zip Java版贪吃蛇游戏.zipJava版贪吃蛇游戏.zipJava版贪吃蛇游戏.zip Java版贪吃蛇游戏....

    Q版贪吃蛇源码

    《Q版贪吃蛇源码解析与学习指南》 贪吃蛇是一款经典的电子游戏,以其简单易上手、趣味性强的特点深受玩家喜爱。本篇将深入解析基于Cocos2d-x框架开发的Q版贪吃蛇源码,帮助读者了解其背后的编程原理和技术实现。 ...

    C语言多功能高级版贪吃蛇

    【标题】"C语言多功能高级版贪吃蛇"是一个基于C语言编程的项目,它将经典游戏贪吃蛇提升到了一个更高的层次,可能包含了更复杂的功能和优化的算法。在C语言的基础上,开发者可能利用了指针、结构体、循环、条件判断...

    个人编写的贪吃蛇

    8. **代码组织**:一个良好的项目结构是关键,代码可能会被组织成多个类,如Snake类、Food类和Game类,每个类负责不同的功能,遵循面向对象编程的原则。 通过分析这个个人编写的贪吃蛇代码,我们可以学习到如何用...

    自己写的一个贪吃蛇游戏分享

    很久以前自己用c++在vs2008下实现的一个贪吃蛇游戏, 框架用的是win32, 绘图用的是简单的windows GDI, 用到了双画面缓冲, 很适合学游戏开发的初学者, 代码风格一般般, 如果有什么地方写得不好的话, 欢迎大家...

    用C#写的贪吃蛇

    【标题】"用C#写的贪吃蛇"是一款基于C#编程...总的来说,"用C#写的贪吃蛇"项目是一个结合了C#编程、游戏逻辑、多媒体处理和用户交互的综合实践案例,对于学习C#和游戏开发的初学者来说,这是一个很好的学习和参考资源。

    vb写的贪吃蛇,附带源码

    vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的贪吃蛇vb写的...

    用python写一个贪吃蛇小游戏

    用python写一个贪吃蛇小游戏,只需要短短十几行代码,就可以写出一个贪吃蛇小游戏

    API写的贪吃蛇,VC++6.0

    标题中的“API写的贪吃蛇,VC++6.0”指的是使用Windows API(Application Programming Interface)来编写的一个经典游戏——贪吃蛇,该程序是在Microsoft Visual C++ 6.0集成开发环境中编译和运行的。Windows API是...

Global site tag (gtag.js) - Google Analytics