贪吃蛇c语言程序 简书,js版贪吃蛇

这家伙想通了其实超级简单

原理,主要就是绘制食物和蛇咯,食物出现的位置需要检测(不出现在蛇身上),至于蛇(蛇身存为一个二维数组[[1,1],[1,2],...]),数组的unshift吃食物和pop方法移动就可以搞定了,不管蛇身多长,也不会有啥性能问题......

自己写的源码:

/*

#tcs {

width: 400px;

height: 400px;

margin: 100px auto 0;

}

#tcs div {

float: left;

width: 20px;

height: 20px;

background: #000;

}

#tcs div.worm {

background: red;

}

#tcs div.snake {

background: blue;

}

*/

var Djtcs = function() {

this.elem = document.getElementById('tcs');

// 方向

this.dir = null;

// 蛇

this.snake = [

[10, 10]

];

// 食物

this.worm = null;

// 上一次蛇停留的最后一个位置

this.last = this.snake[0];

// 是否开启游戏

this.isstart = false;

// 定时器

this.timer = null;

this.t = 520;

};

Djtcs.prototype = {

init: function() {

var _t = this,

str = '';

// 生成地图

for (var i = 0; i < 400; i++) str += '

this.elem.innerHTML = str;

// 蛇

this.getCd(this.snake[0]).className = 'snake';

// 食物

this.showWorm();

// 方向键

document.onkeydown = function(ev) {

var dir = [-1, -2, 1, 2][(ev || window.event).keyCode - 37];

if (!!dir && _t.dir !== dir && (dir + _t.dir) !== 0 && (_t.dir = dir)) _t.snakeMove();

if (!!dir) {

ev.preventDefault && ev.preventDefault();

return false;

}

}

},

getCd: function(a) {

return this.elem.children[a[0] + 20 * a[1]];

},

//定时运动

snakeMove: function(d) {

clearInterval(this.timer);

if (this.gameOver) return false;

var _t = this,

s = this.snake[0],

shead = [s[0] + (_t.dir === -1 ? -1 : _t.dir === 1 ? 1 : 0), s[1] + (_t.dir === -2 ? -1 : _t.dir === 2 ? 1 : 0)];

if (this.test(shead)) {

this.eat(shead, this.worm).snakeGo(shead);

this.timer = setTimeout(function() {

_t.snakeMove();

}, this.t);

} else {

this.gameOver = true;

alert('游戏结束!');

}

},

//前进

snakeGo: function(a) {

this.last = this.snake.pop();

this.getCd(this.last).className = '';

this.snake.unshift(a);

this.getCd(a).className = 'snake';

},

//显示食物

showWorm: function() {

this.worm = this.rn();

this.getCd(this.worm).className = 'worm';

},

//吃食物

eat: function(a, b) {

//达到条件吃掉,然后继续给他食物

if (a[0] === b[0] && a[1] === b[1]) {

this.snake.push(this.last);

this.getCd(this.last).className = 'snake';

this.getCd(a).className = '';

this.showWorm();

}

return this;

},

//检测是否游戏结束

test: function(a) {

if (a[0] < 0 || a[1] < 0 || a[0] > 19 || a[1] > 19 || ('|' + this.snake.join('|') + '|').indexOf('|' + a.toString() + '|') >= 0) return !1;

return !0;

},

//食物生成并检测

rn: function() {

var arr = [~~(Math.random() * 20), ~~(Math.random() * 20)];

arr = ('|' + this.snake.join('|') + '|').indexOf('|' + arr.toString() + '|') >= 0 ? this.rn() : arr;

return arr;

}

};

window.onload = function() {

var tcs = new Djtcs();

tcs.init();

}

当然还有很多细节需要处理啦。演示地址

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值