Bonjour,

Mon jeu Guyana-Dream, réalisé avec la balise canvas, est du javascript pur (ou est censé en être !), volontairement simple et sans POO (Voir aussi sur github)

J'ai déjà fait un topic dessus, donc j'espère que le fait de poster un autre topic n'est pas gênant, mais là, j'ai une demande précise.

Je suis en train de remanier mon code pour qu'il soit plus moderne (remplacer var par let, par exemple), et j'essaie d'ajouter des fonctionnalités comme la possibilité de rejouer à la fin. La version la plus avancée est tuto8-1a. Il y a encore plusieurs choses qui fonctionnent mal, en particulier quand on essaie de rejouer. Je ne sais pas trop comment réinitialiser tout.

J'ai fait pas mal de petits fichiers js qui s’occupent chacun d'une phase précise du jeu. Je les ai mis en lien sur la page tuto8-1a.

Je ne suis pas certaine que j'ai bien structuré mes fichiers, et je me demande si ce n'est pas à cause de ça que certaines choses ne fonctionnent pas. J'ai essayé de trouver sur le net les bonnes pratiques, mais je n'ai pas trouvé grand chose que je comprenne.

Je lis aussi qu'il faut éviter les variables globales, mais si je ne les utilise pas, ça ne fonctionne pas comme il faut.

Si vous avez des conseils sur la structuration du code et la gestion des variables qui soit applicable à ce jeu (ou à d'autres projets), je serai très reconnaissante !

-
Edité par doudoulolita 23 septembre 2018 à 1:45:18

Salut

C'est normal que tu aies des soucis. Tu déclares des variables globales dans tous les sens que tu réutilises dans d'autres fichiers. T'imagines si ton code continue à grossir, que tu ajoutes d'autres fichiers, comment vas tu t'y retrouver?

De plus cela rend l'ensemble de ton code très compliqué à lire, car on doit fouiner dans chaque fichier pour savoir d'où sort telle fonction ou variable qui n'a pas été déclarée dans le fichier qu'on est en train de regarder.

Si j'avais juste un conseil à te donner, ce serait d'utiliser un module bundler. Le plus populaire actuellement est webpack.

Merci,c'est vrai que j'ai beaucoup de fichiers, et que j'ai beaucoup de variables globales. D'un autre côté, des fichiers très gros ne sont pas évidents à comprendre non plus, non ?

Cependant, je ne souhaite pas ajouter de module, je veux que ça reste du pur javascript.

J'ai déjà diminué le nombre de fichiers js dans tuto8-1b, mais je n'arrive pas encore à diminuer le nombre de variables globales.

Comme j'ai pas mal de fonctions qui font appel aux mêmes variables, je suis obligée de les mettre en global, il me semble.

Sinon, la fonction compteTemps pose problème sur le serveur alors que ça marche en local, je ne comprends pas.

En plus, j'ai trouvé des explications, je ne sais plus où, où au lieu de faire des boucles avec i, j et des lettres de ce type, on déclare des variables pour rendre la boucle plus lisible. D'où des variables en plus qui mettent encore plus le bazar !

Par exemple :

/* fonction parcourant le tableau de la carte pour dessiner les tuiles (appelée dans la fonction changeCarte et dans le fichier ecran.js) */

let ligne = 0;
let colonne = 0;

function dessineCarte() {
	for (let j=ligne; j<cartes[numCarte-1].length; j++) {//On parcourt chaque ligne de la carte
		for(let i=colonne; i<cartes[numCarte-1][j].length; i++) {//on parcourt chaque numéro de la ligne (soit les colonnes de la carte)
			dessineTuiles(cartes[numCarte-1][j][i], tailleTuile*i, tailleTuile*j)// cartes[numCarte-1][j][i] représente le numéro de la tuile de la j ème ligne et de la i ème colonne qu'on positionne en ajoutant une largeur de tuile à chaque fois en abcisse et une largeur de tuile à chaque fois en ordonnée
		}
	}
}

 Je vais voir plus tard si je peux encore améliorer mon code. Il faut bien dormir un peu !

-
Edité par doudoulolita 23 septembre 2018 à 2:03:57

doudoulolita a écrit:

Cependant, je ne souhaite pas ajouter de module, je veux que ça reste du pur javascript.

Ecrire du Javascript comme il y a 10 ans n'est pas écrire du pur Javascript. Javascript est un langage qui évolue, et on peut utiliser les modules en pur Javacscript. De plus, il est tout a fait possible de se passer de variables globales même en n'utilisant pas de modules.

doudoulolita a écrit:

Comme j'ai pas mal de fonctions qui font appel aux mêmes variables, je suis obligée de les mettre en global, il me semble.

Non pas du tout, les variables globales sont toujours à éviter au maximum. Et on peut tout à fait utiliser une même donnée dans différentes fonction en la passant en paramètre notamment. L'utilisation des classes, la programmation fonctionnelle et bien d'autres méthodes permettent d'éviter ça. Dans tous les cas, je te conseille d'aller regarder du code d'autres personnes ou de regarder coder certaines personnes (live programming) pour connaître les bonnes pratiques afin de créer du code élégant.

Merci de tes conseils.

Je ne voyais vraiment pas comment me passer des variables globales, maintenant je comprends mieux et je vais pouvoir essayer.

Je souhaite quand même rester assez simple, c'est surtout ça qui importe pour moi, et c'est la raison pour la quelle je ne veux pas me lancer maintenant dans les classes et tout ce dont tu parles. J'ai lu quelques cours qui en parlent mais j'ai encore du mal à saisir comment l'utiliser dans mon jeu.

Est-ce que tu as des exemples de code élégant à me conseiller ? En effet, il n'est pas évident pour moi de reconnaître du beau code....

-
Edité par doudoulolita 12 octobre 2018 à 20:21:09

Mieux que du code, voici un site qui est très bien pour apprendre à coder en vanilla Js via de petits projets : https://javascript30.com/

Encore un post pour dire que j'ai regardé un peu plus https://javascript30.com/ et que j'ai aussi trouvé les vidéos de mmtuts

Depuis, j'ai aussi essayé de faire moins de fichiers : https://github.com/doudoulolita/Guyana-Dream/tree/master/tuto2/tuto6-6

Comme je souhaite démarrer tout doucement la POO, on m'a conseillé de réfléchir façon POO pour organiser mes fichiers en code classique. Le fichier Persos contient donc tout ce qui les concerne, aussi bien les variables que les fonctions., alors qu'avant je mettais tout ça dans des fichiers séparés.

Il y a encore mon fichier main.js qui est tout petit, je voulais le placer au début du fichier jeu.js mais ça ne fonctionne pas. Je vais faire d'autres essais.

Il y a encore du travail de simplification à faire, surtout pour les variables globales. Mais j'espère encore progresser !