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

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

黄舟
Libérer: 2017-12-04 11:20:26
original
1888 Les gens l'ont consulté

"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


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


Adresse de lecture du cours : //m.sbmmt.com/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;  //是否开始
Copier après la connexion
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);  //放地图的容器
}
Copier après la connexion
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 : //m.sbmmt.com/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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal