javascript實現貪吃蛇代碼
在習作的過程中嘗試着貪吃蛇遊戲用JS實現了。竟然成功了。
思路:使用10px*10px的div層擔當“像素”,然後使用40*40矩陣160個“像素”構成了遊戲的界面。
下面是代碼:
複製代碼 代碼如下:
// JavaScript Document
alert("鍵盤的方向鍵控制方向,空格鍵暫停。nLIFE製作n");
// 添加基本的圖形塊,即160個10 * 10的層組成的二維矩陣
var rowindex = new Array(40);
var colindex;
var cell;
// 圖像單元的定義
var backcolor = "black";
for(var i = 0; i < 40; i ++ )
{
colindex = new Array(40);
for(var j = 0; j < 40; j ++ )
{
// 設置每個單元的屬性
cell = teElement("div");
groundColor = backcolor;
h = "10px";
ht = "10px";
tion = "absolute";
= "" + (j * 10 + 100) + "px";
= "" + (i * 10 + 100) + "px";
flow = "hidden";
// 添加單元
ndChild(cell);
// 填充列組
colindex[j] = cell;
}
// 填充行組
rowindex[i] = colindex;
}
// 貪吃蛇類的'定義,基於基本的圖像單元
function snake()
{
// 定義蛇的身體,並初始化
color = "white";
s = new Array();
for(var i = 20; i < 25; i ++ )
{
rowindex[20][i]groundColor = color;
// rowindex的第一個座標是行標,第二是列標
(rowindex[20][i]);
}
// 定義蛇的頭部座標,第一個是行標, 第二個是列標
= [20, 20];
// 定義蛇的前進方向,0代表左、1代表下、2代表右、3代表上
ct = 0;
}
// 移動模塊
function move()
{
// 根據前進方向計算頭部的座標
switch(ct)
{
case 0 :
[1] -= 1;
break;
case 1 :
[0] += 1;
break;
case 2 :
[1] += 1;
break;
case 3 :
[0] -= 1;
break;
}
// 判斷是否越界
if([0] < 0 || [0] > 39 || [1] < 0 || [1] > 39)
{
// 如果越界則返回false
return false;
}
else
// 如果沒有越界則檢查下一個元素的性質,如果是食物則吃掉,並再生成食物。如果是其自身則返回false
if([0] == food[0] && [1] == food[1])
{
// 如果是食物
rowindex[[0]][[1]]groundColor = color;
ift(rowindex[[0]][[1]]);
score++;
makefood();
return true;
}
else
// 如果是它自身
if(rowindex[[0]][[1]]groundColor == color)
{
if(rowindex[[0]][[1]] == ())// 如果是它的尾部
{
ift(rowindex[[0]][[1]]);
return true;
}
// 如果不是尾部
return false;
}
// 以上情況都不是
()groundColor = backcolor;
rowindex[[0]][[1]]groundColor = color;
ift(rowindex[[0]][[1]]);
return true;
}
= move;
// 生成食物模塊
var foodcolor = "blue";
var food = [20, 17];
rowindex[food[0]][food[1]]groundColor = foodcolor;
function makefood()
{
var tempfood;
var tempelement;
out :
while(true)
{
tempfood = [d(om() * 39), d(om() * 39)];
tempelement = rowindex[tempfood[0]][tempfood[1]];
for(var i in s)
{
if(s[i] == tempelement)
{
// 如果隨機生成的食物在蛇的身體上,則跳出繼續
continue out;
}
// 生成食物成功
break out;
}
}
food = tempfood;
rowindex[food[0]][food[1]]groundColor = foodcolor;
}
// 轉向模塊和暫停模塊
ydown = turnorstop;
function turnorstop(event)
{
if(t != undefined)
{
if(parseInt(ode)==32)
{
alert("休息一下");
}
else
{
switch(parseInt(ode))
{
case 37 :
if(ct!=2)
ct = 0;
break;
case 38 :
if(ct!=1)
ct = 3;
break;
case 39 :
if(ct!=0)
ct = 2;
break;
case 40 :
if(ct!=3)
ct = 1;
break;
}
}
}
else
{
if(parseInt(h)==32)
{
alert("休息一下");
}
else
{
switch(parseInt(h))
{
case 37 :
if(ct!=2)
ct = 0;
break;
case 38 :
if(ct!=1)
ct = 3;
break;
case 39 :
if(ct!=0)
ct = 2;
break;
case 40 :
if(ct!=3)
ct = 1;
break;
}
}
}
}
// 啟動遊戲模塊
var s = new snake();
var time = 60;//蛇的速度指數
function startmove()
{
if(())
{
setTimeout(startmove, time);
}
else
{
alert("GAME OVERn您的分數是:"+score+"分");
}
}
//分數設置
var score = -1;
//運行遊戲
startmove();
在網頁中連接該JS文件即可。
-
如何理解Javascript的caller,callee,call,apply區別
在提到上述的概念之前,首先想説説javascript中函數的隱含參數:argumentsarguments該對象代表正在執行的函數和調用它的函數的參數。[function.]arguments[n]參數function:選項。當前正在執行的Function對象的名字。n:選項。要傳遞給Function對象的從0開始的參數值...
-
javascript閉包的定義及應用實例分析
官方解釋“閉包”是一個擁有許多變量和綁定了這些變量的環境表達式(通常是一個函數),因而這些變量也是環境表達式的一部分。通俗解釋Javascript中所有的函數都是一個閉包。不過一般來説,嵌套的function產生的閉包更為強大,也是大部分時候我們所説的“閉包”。看如下...
-
win2008 ASP顯示500內部錯誤不能顯示詳細錯誤的解決方法
在win2008系統中,有用户遇到這樣的情況:網站後台顯示500內部錯誤,但是卻無法打開詳細的錯誤信息。無法查看詳細的錯誤信息,用户就不能根據具體問題來解決了,這是一件很麻煩的事情。其實用户可以通過修改win2008系統中的IIS設置來顯示這個詳細的錯誤信息。一、造成50...
-
學習JavaScript的7個理由
為什麼要學習JavaScript?學習JavaScript對我們的工作有什麼幫助麼?下面YJBYS小編為大家講解!需求我之所以這樣説的主要原因是,隨着JavaScript的日漸成熟,以及方案變得越來越可行,我們對JavaScript程序員的需求正在持續增長。JavaScript在需求比例上已經超過了C#,僅...