Discussion :

[Adnbnt]

Bonjour à tous,

Nouvel apprenant dans le monde de la programmation, j'effectue mes premiers pas sur le site Khanacademy. Tout se passe très bien pour moi, j'ai assimilé beaucoup de choses. Cependant, je suis tombé sur mon premier obstacle. L'enchainement d'apprentissage des boucles while/for, et des tableaux.

Ici, je dois réaliser une petite animation de gouttes de pluie en mettant en éxecution les tableaux (pour le nombre de goutte), la boucle "for" pour répéter l'incrémentation de la goutte vers le bas sur l'axe Y. Je dois intégrer une partie de code pour répéter la fonction draw indéfiniment sous forme de condition. C'est à dire, quand les gouttes touchent le sol, elles repartent d'en haut pour à nouveau toucher le sol.

Voici la partie de code qui est donné :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
var xPositions = [200];
var yPositions = [0];
 
draw = function() {
    background(71, 71, 71);
 
    for (var i = 0; i < xPositions.length; i++) {
        noStroke();
        fill(0, 200, 255);
        ellipse(xPositions[i], yPositions[i], 10, 10);
        yPositions[i] += 5;
    }
 
};

J'ai essayé un tas de choses, bien que mes connaissances soient très légères. Je n'ai pas réussi à effectuer la répétition. J'ai essayé également via une condition If (mouseIsPressed), sans résultat non plus.

Merci d'avance pour vos réponses !

[javatwister]

Bonjour,

Il manque un peu de code pour mieux comprendre ce que tu as fait; un lien vers le rendu serait intéressant;

[Watilin]

Je crois deviner l’intention ici :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
var xPositions = [200];
var yPositions = [0];

Tu as voulu définir un tableau à 200 emplacements pour x, et un tableau vide pour y. En réalité, JavaScript a créé, pour chacune de ces deux variables, un tableau à 1 emplacement contenant le nombre 200 pour x et le nombre 0 pour y.

En fait, ça ne sert pas à grand chose de donner une taille de départ à un tableau en JavaScript, à part quand on cherche à optimiser (et encore, je ne crois pas que ce soit une bonne idée personnellement). La taille d’un tableau est dynamique et évolue en fonction des choses qu’on y met. En l’occurence, tu peux très bien déclarer deux tableaux vides :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
var xPositions = [];
var yPositions = [];

Et spécifier en dur dans la boucle for le nombre d’itérations, et ainsi le nombre d’éléments qui seront insérés dans les tableaux.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
for (var i = 0; i < 200; i++) {
  ...
}

Mais un réflexe à adopter, dès qu’on rencontre une valeur en dur dans le code, est de se poser la question : « est-ce que je n’ai pas intérêt à utiliser une constante ? »
Ton cours en ligne n’a peut-être pas encore abordé le sujet des constantes, mais s’il est bien fait, il y viendra bientôt. Les constantes permettent d’éviter les répétitions et de n’avoir qu’un seul endroit à modifier dans le code quand on veut changer la valeur, par exemple mettre 300 à la place de 200.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
const ITERATIONS = 200;
 
...
 
for (var i = 0; i < ITERATIONS; i++) {
  ...
}

Pour terminer, un petit conseil : pense à utiliser la console F12 pour examiner tes variables dès que tu as un doute

[Loralina]

Bonjour,
C'est une possibilité Watilin, d'un autre côté, il dit que c'est une partie de code donnée... Il n'y a peut-être bien qu'une goutte pour démarrer.

C'est à dire, quand les gouttes touchent le sol, elles repartent d'en haut pour à nouveau toucher le sol.

Essayer ceci en fin de boucle :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
if(yPositions[i]>ySol) {
	yPositions[i]=0;
}

"ySol" étant soit à remplacer directement par la valeur souhaitée, soit à définir sous forme de variable ou constante par ailleurs.