Mini jeu en JavaScript , error "to much recursion"
kat
-
30 mars 2021 à 09:25
hypothetix
Messages postés119Date d'inscriptiondimanche 19 janvier 2020StatutMembreDernière intervention25 mars 2023
-
30 mars 2021 à 18:49
Bonjour, je suis actuellement débutante en dans le développement Web, JS est mon premier langage de programmation ( après HTML et CSS). J'apprend pour le moment en autodidacte, donc j'ai du mal à voir et comprendre mes erreurs.
J'essaie de crée un mini jeu en JS pour le présenter lors d'un entretient pour une formation ( le but étant de faire cette formation en alternance, donc d'avoir quelques base et quelques projets à presenter également aux entreprise).
Je suis actuellement bloquer sur mon code, avec l'erreur "to much recursion".
Le but de mon code est de crée un "jeu de la taupe" ( en gros, des visage apparaissent et disparaissent aléatoirement sur les positions aléatoire, pour une durée de temps aléatoire mais comprise entre deux valeurs, d'augmenter le score lorsqu'on appuie sur un visage, et de crée une fonction pour que le jeu ce finisse )
J'aurais besoin d'une ame charitable pour m'aider à comprendre où et pouquoi ca bloque exactement...
Voici mes codes HTML/ CSS et JS :
const clouds = document.querySelectorAll(".hole");
const scoreBoard = document.querySelector(".score");
const heads = document.querySelectorAll(".head");
let lastCloud;
let timeUp = false; // False si pas fini, true si fini
let score = 0;
function randomTime(min, max) { // Temps aléatoire
return Math.round(Math.random() * (max - min) + min);
}
function randomCloud(clouds) { // Selection de nuage aléatoire avec une fonction récursive
const indexCloud = Math.floor(Math.random() * clouds.lenght);
const cloudSelect = clouds[indexCloud];
if (cloudSelect === lastCloud) { // Pas renvoyer le meme nuage qu'avant
return randomCloud(clouds);
}
lastCloud = cloudSelect;
return cloudSelect;
}
function showHead(){
const time = randomTime(1000, 1500); // interval de temps en MS
const cloud = randomCloud(clouds);
cloud.classList.add("up"); // .hole.up classe déja existante en CSS. Sert à faire sortir les têtes
setTimeout(() => {
if (!timeUp) showHead(); //Fonction récursive
cloud.classList.remove("up");
}, time); // exécuter une fonction à partir d'un certain délais
}
function playerScore(event) { // test de faux click
if (!event.isTrusted) return;
score++; // augmenter le score
this.classList.remove("up");
scoreBoard.textContent = score;
}
heads.forEach(head => head.addEventListener("click", playerScore));
function startGame(){
scoreBoard.textContent = 0;
socre = 0;
timeUp = false;
showHead();
setTimeout(() => {
timeUp = true; // condition d'arret du jeu
setTimeout(() => {
scoreBoard.textContent = "end";
}, 2000);
}, 10000);
}
startGame();
