Chuanzhi Podcast Achèvement orienté objet JavaScript du matériel de didacticiel vidéo du jeu Snake (cours, code source) partage

"Chuanzhi Podcast JavaScript orienté objet Achèvement du didacticiel vidéo du jeu Snake" présente les connaissances sur JavaScript orienté objet et utilise des idées de programmation orientée objet pour compléter le jeu Snake. L'écriture est plutôt confuse et il y a une erreur logique : après que le serpent ait mangé le fruit, il devrait ajouter une section à la queue du serpent, mais il est écrit comme ajoutant une section à la tête du serpent - -. Vous pouvez utiliser les touches haut, bas, gauche et droite du clavier

Adresse de lecture du cours : http://www.php.cn/course/591.html

L'adresse du professeur style d'enseignement :

Les cours du professeur sont vivants, pleins d'esprit, pleins d'esprit et touchants. Une métaphore vivante est comme la touche finale, ouvrant la porte à la sagesse aux étudiants ; un humour bien placé apporte un sourire entendu aux étudiants, comme boire un verre de vin moelleux, donnant aux gens un arrière-goût et une nostalgie des aphorismes d'un philosophe, des références culturelles ; sont intercalés de temps en temps dans la narration, donnant aux gens réflexion et vigilance.

La partie la plus difficile de cette vidéo est le serpent gourmand :

Penser

Les principaux de le serpent gourmand Le problème doit être résolu

Tournez, chaque point du corps du serpent doit tourner en passant le point tournant

Mangez, à chaque fois qu'on en mange, le corps du serpent augmentera de un point

Un échec, heurter un mur ou heurter un serpent est considéré comme un échec

En gros, "Snake" est difficile à ces trois endroits. Dans cet ordre, la difficulté va de haut en bas. Le plus simple est de ne pas heurter le mur. Le plus dur est de diriger, puis de manger. Résolvons ces problèmes étape par étape dès le début.

Quelques variables

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;  //是否开始

Initialisation de la carte

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

La carte est très simple, mais veuillez noter qu'elle doit commencer par 0, 0 dans la première ligne et 0 sur la deuxième ligne. À partir de 0, 1, etc., il s'agit d'un tableau bidimensionnel directement lié au positionnement, une telle structure doit donc être garantie.

Chaque point généré possède un identifiant basé sur des coordonnées verticales et horizontales, qui seront nécessaires pour contrôler ces points

Ici, nous vous recommandons également de télécharger les ressources du code source : http://www.php.cn/xiazai/learn/2117

1. notes .docx

2. drawing.xlsx

3. snake.html (code source)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!