欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

传智播客JavaScript面向对象完成贪吃蛇游戏视频教程资料(课件、源码)分享

程序员文章站 2022-04-24 16:57:41
...
《传智播客JavaScript面向对象完成贪吃蛇游戏视频教程》介绍了关于JavaScript面向对象的知识,利用面向对象的编程思想去完成贪吃蛇游戏。写的比较乱,有个逻辑错误:蛇吃了果果后应该是蛇尾加一节,写成了蛇头部增加一节- -。可用键盘的上下左右键操作;


传智播客JavaScript面向对象完成贪吃蛇游戏视频教程资料(课件、源码)分享


课程播放地址:http://www.php.cn/course/591.html


该老师讲课风格:

教师讲课生动形象,机智诙谐,妙语连珠,动人心弦。一个生动形象的比喻,犹如画龙点睛,给学生开启智慧之门;一种恰如其分的幽默,引来学生会心的微笑,如饮一杯甘醇的美酒,给人以回味和留恋;哲人的警句、文化的箴言不时穿插于讲述中间,给人以思考和警醒。


本视频中较为难点贪吃蛇了:

思路

贪食蛇主要几个问题需要解决

转向,蛇身每个点在经过转向点的时候都要转向

吃,每吃掉一颗,蛇身就增加一个点

失败,撞墙或撞到蛇身上,都算失败

基本上,《贪食蛇》就难在这三个地方,这个顺序,难度从高到低,最简单的莫过去撞墙判断失败。最难的是转向,之后是吃。下面从最开始一步步的来解决这些问题。

一些变量

var mapItemX=60;  //游戏地图横向点数
var mapItemY=31;  //游戏地图纵向点数
var snakeLen=5;  //蛇的初始长度
var snakeMoveDirection='E';  //蛇的移动方向
var snakeStartPoints={'x':5,'y':15};  //蛇的起始位置
var snake=new Array();  //用于存放蛇身点的坐标
var corner=new Array();  //用于存放转角点坐标
var cornerNum=0;  //转角数
var timer,speed=100;  //移动计时器和初始移动速度
var timeiner,timeSecond=0,timeMinute=0,timestr=0;  //时间计时器,分,秒,总秒数
var mouseX,mouseY;  //老鼠位置(吃的)
var start=false;  //是否开始

初始化地图

function init(){
    var maps='';
    for(var i=0;i<mapItemY;i++){
        for(var j=0;j<mapItemX;j++){
            maps=maps+'<p id="mapItem_'+j+'_'+i+'" class="mapItem"></p>';
        }
    }
    $("#game_map").html(maps);  //放地图的容器
}

地图很简单,不过要注意,必须保证以第一行0,0开始,第二行0,1开始,以此类推,它是一个二维数组,这直接关系到定位,所以必须得保证这样的结构。

生成的每一个点,都有一个根据纵横坐标组成的ID,它将是控制这些点的必要东西



这里还给大家推荐了源码资源的下载:http://www.php.cn/xiazai/learn/2117

  1. 笔记.docx

  2. 画图.xlsx

  3. snake.html(源码)

以上就是传智播客JavaScript面向对象完成贪吃蛇游戏视频教程资料(课件、源码)分享的详细内容,更多请关注其它相关文章!