Médiaforma

Memory – Etape 2

Print Friendly

Deuxième étape : Tirage aléatoire des cartes

Le but du jeu est d’apparier douze cartes. Pour représenter ces cartes, nous allons leur affecter un chiffre compris entre 1 et 6. La position initiale des cartes est définie dans le corps du document, via la variable JavaScript init :

var init=’123456654321′;

Pour mélanger les cartes, nous allons utiliser plusieurs fonctions JavaScript :

  • split() pour diviser la chaîne init en un tableau de douze éléments : un pour chaque caractère ;
  • sort() pour trier les caractères isolés par la fonction split() ;
  • Math.random() pour obtenir un nombre pseudo aléatoire compris entre 0 et 1. Les valeurs retournées par cette fonction sont générées à partir de l’horloge de l’ordinateur.
  • join() pour rassembler les caractères afin d’en faire une chaîne unique.

Voici la syntaxe utilisée :

var cartes = init.split( »).sort(function(){return 0.5-Math.random()}).join( »);

Cette méthode n’est pas optimale, car elle est influencée par la position de départ des éléments à trier. Cependant, dans notre jeu, elle sera bien suffisante !

Les fonctions split(), sort() et join() s’enchaînent. Ainsi, le résultat de la fonction split() sert d’entrée à la fonction sort() et le résultat de la fonction sort() sert d’entrée à la fonction join().

S’il est facile de comprendre l’utilité des fonctions split() et join(), la fonction sort() vous semble peut-être obscure. Voyons comment elle fonctionne.

Sans argument, cette méthode classe par ordre croissant (s’il s’agit de nombres) ou alphabétique (s’il s’agit de texte) les éléments sur lesquels elle travaille.

Lorsqu’une fonction est passée en argument, c’est-à-dire entre les parenthèses de la fonction, les éléments du tableau sont classés en fonction des valeurs retournées par la fonction. Supposons que les éléments a et b doivent être comparés :

  • Si la fonction retourne une valeur négative ou nulle, les éléments a et b sont laissés tels quels ;
  • Si la fonction retourne une valeur positive, les éléments a et b sont inversés.

Dans notre exemple, la fonction retourne la valeur 0.5 – Math .random(). Etant donné que Math.random() retourne des valeurs pseudo-aléatoires comprises entre 0 et 1, l’expression 0.5 – Math.random() retournera des valeurs pseudo-aléatoires comprises entre -0.5 et 0.5. Les éléments du tableau seront donc mélangés, ce qui est exactement l’effet recherché.

Vous avez aimé cet article ? Partagez-le avec vos réseaux...
 
Comments

No comments yet.

Leave a Reply