用原用JS写一个贪食蛇

第一步，写好一个盒子（让蛇在里面走），宽 800 p x,高 600 p x;
第二步,写一个食特的构造函数 Function food(){
this.width = width || 20;
this.height = height || 20;
this.backgroundColor = bgc || “green”;
this.left = 0;
this.bottom = 0;
}

一开始在这里写错js的名字一看我就是新手啦啊,的确进来这个行业不多.

还有这个"box"错写为".box",真的是醉了.

效果图随机食物出来了
第三步,写一个生成蛇的构造函数.

先借助画图软件写出刚渲染出的蛇的身段,然后得出位置.

蛇有三节,所以定义body是一个包有三个数的数组

这个上下文调用模式很关键,不然找不到Snake对象中的direction

用一个数组保存蛇身体的原来的位置

问题来了,再次走时,蛇原来的身体还在???怎么办呢?

传入这个参数很重要,让它能找到那个对象.this.snake;

给window添加键盘按下事件,让蛇可以四个方法移动.

易错点,删蛇身时,要从后往前删,要不删不干净.

顺序很重要,要不两个蛇身会走在一处的.

有BUG如下图

解决的方法如下:

蛇吃进食物后加在尾部;好关键的一部

不能少写一个减1

//让food这个量变全局变量,当蛇吃了食物时,食物的位置发生了变化.

//加入这些条件是让蛇只能左右转,前进,不能后退;

这是一个易错点,还没有改过来的.

//两个判断条件,但是出现了下面的BUG

这里没写好.汗汗