souvent, lors du développement de projets, vous vous retrouverez à la recherche de moyens de générer des nombres aléatoires.

les cas d’utilisation les plus courants pour générer des nombres aléatoires sont les jeux de hasard comme lancer des dés, mélanger des cartes à Jouer et faire tourner des roues de roulette.

dans ce guide, vous apprendrez comment générer un nombre aléatoire en utilisant la méthode Math.random() en construisant un mini jeu de dés.

Les Mathématiques.,random() method

l’objet Math en JavaScript est un objet intégré qui possède des propriétés et des méthodes pour effectuer des calculs mathématiques.

une utilisation courante de l’objetMathconsiste à créer un nombre aléatoire en utilisant la méthoderandom().

const randomValue = Math.random();

Mais Math.random() méthode ne retourne en fait un nombre entier. Au lieu de cela, il renvoie une valeur en virgule flottante comprise entre 0 (inclusif) et 1 (exclusif)., Notez également que la valeur renvoyée par Math.random() est de nature pseudo-aléatoire.

Les nombres aléatoires générés parMath.random() peuvent sembler aléatoires, mais ces nombres se répètent et finissent par afficher un motif non aléatoire sur une période de temps.

c’est parce que la génération de nombres aléatoires algorithmiques ne peut jamais être vraiment aléatoire dans la nature. C’est pourquoi nous les appelons générateurs de nombres pseudo-aléatoires (PRNG).

pour en savoir plus sur la méthodeMath.random(), vous pouvez consulter ce guide.,

fonction de générateur de nombres aléatoires

maintenant, utilisons la méthodeMath.random() pour créer une fonction qui retournera un entier aléatoire entre deux valeurs (inclusivement).

const getRandomNumber = (min, max) => { return Math.floor(Math.random() * (max - min + 1)) + min;};

nous allons briser la logique ici.

la méthodeMath.random() renverra un nombre à virgule flottante entre 0 et 1 (exclusif).

Les intervalles seraient donc les suivants:

[0 .................................... 1)[min .................................... max)

pour factoriser le deuxième intervalle, soustrayez min des deux extrémités. Cela vous donnerait donc un intervalle entre 0 et max-min.,

[0 .................................... 1)[0 .................................... max - min)

Donc maintenant, pour obtenir une valeur aléatoire vous devez faire ceci:

const x = Math.random() * (max - min)

Ici x est la valeur aléatoire.

Actuellement, max est exclue de l’intervalle. Pour le rendre inclusif, ajouter 1. En outre, vous devez ajouter lemin qui a été soustrait plus tôt pour obtenir une valeur entre[min, max).

const x = Math.random() * (max - min + 1) + min

Bon, alors maintenant, la dernière étape est celle de assurez-vous que x est toujours un entier.,

const x = Math.floor(Math.random() * (max - min + 1)) + min

Vous pouvez utiliser la balise Math.round() méthode au lieu de floor(), mais ce serait vous donner une distribution non uniforme. Cela signifie que max Et min auront une demi-chance de sortir comme résultat. L’utilisation de Math.floor() vous donnera une distribution parfaitement uniforme.

maintenant que vous avez une bonne compréhension du fonctionnement d’une génération aléatoire, utilisons cette fonction pour simuler le lancer de dés.,

the Rolling Dice Game

dans cette section, nous allons créer un mini jeu de dés vraiment simple. Deux joueurs entrent leur nom et lanceront les dés. Le joueur dont les dés ont un nombre plus élevé gagnera le tour.

tout d’Abord, créez une fonction: rollDice qui simule l’action de rouler les dés.

à l’Intérieur du corps de la fonction, appelez le getRandomNumber() fonction avec 1 et 6 comme arguments. Cela vous donnera n’importe quel nombre aléatoire entre 1 et 6 (les deux inclus) tout comme la façon dont les vrais dés fonctionneraient.,

const rollDice = () => getRandomNumber(1, 6);

ensuite, créez deux champs de saisie et un bouton comme indiqué ci-dessous:

lorsque vous cliquez sur le bouton »Lancer des dés », récupérez les noms des joueurs à partir des champs de saisie et appelez la fonction rollDice() pour chaque joueur.

Vous pouvez valider les champs de nom des joueurs et embellir le balisage avec un peu de CSS. Dans un souci de brièveté, je garde les choses simples pour ce guide.

c’est tout. Vous pouvez voir la démo ici.

Conclusion

donc, générer des nombres aléatoires en JavaScript n’est pas si aléatoire après tout., Tout ce que nous faisons est de prendre des nombres d’entrée, d’utiliser des mathématiques et de cracher un nombre pseudo-aléatoire.

pour la plupart des applications et des jeux basés sur un navigateur, ce caractère aléatoire est suffisant et sert son but.

c’est tout pour ce guide. Restez en sécurité et continuez à coder comme une bête.