Comment créer des nombres aléatoires dans votre jeu de html5

Les nombres aléatoires sont un élément clé de la programmation de jeux HTML5. Souvent, vous voulez une sorte de comportement aléatoire. Il est utilisé pour imiter la complexité et l'imprévisibilité de l'univers. La plupart des langues disposent d'un générateur de nombres aléatoires intégré. Cette fonction spéciale produit une sorte de numéro de semi-aléatoire. Souvent, vous aurez à faire quelques manipulations pour faire le nombre adapter le modèle que vous souhaitez.

Sommaire

image0.jpg

La page semble un peu complexe, mais il décrit un système puissant et flexible, une fois que vous savez comment l'utiliser. Voici ce qui se passe:

  1. javascript génère un nombre aléatoire.

    Différentes langues le faire de différentes façons, mais javascript a une fonction qui crée une valeur en virgule flottante aléatoire entre 0 et 1. Cette valeur est affichée dans la zone brute.

  2. Multiplier la valeur brute de 100.

    Dans cet exemple, vous voulez un nombre entre 1 et 100. Si vous multipliez un 0 à 1 par 100, vous obtiendrez 0 à 99,9999 (avec beaucoup de neufs) valeur. Cela se rapproche. La boîte de 100 fois montre la valeur brute après qu'il a été multiplié par 100.

  3. Convertir le grand nombre en un entier.

    L'utilisateur ne va jamais à deviner un nombre avec 17 décimales, si vous avez besoin d'un entier. javascript a un certain nombre de façons de convertir un flotteur en entier. Pour obtenir le 1 à 100 le comportement que vous cherchez, vous utilisez une méthode appelée Math.ceil. Le résultat final est représenté dans la dernière case.




Voici le code dans son intégralité:

rand100.html

Assurez nombres aléatoires 1-100

Utilisez les mathématiques pour votre code de jeu

Pour rendre ce programme de travail, vous avez besoin de faire appel à l'arme ultime de geekiness: Math.

javascript dispose d'une bibliothèque merveilleux appelé Math. La Math bibliothèque possède quelque bonté vraiment geek enterré dans elle, comme un certain nombre de fonctions couramment utilisées en mathématiques ainsi que des constantes (comme PI) et quelques autres fonctions utilitaires pour travailler avec des chiffres.

Tout d'abord, bien sûr, est la fonction qui génère des nombres aléatoires. C'est appelé Math.random ().

Vous avez vraiment besoin de dire Math.random (). Si vous appelez random () à lui tout seul, javascript ne saura pas ce que vous parlez.

La Math.random () fonction produit un nombre semi-aléatoire. (Il est pas vraiment au hasard, mais est produite par une formule complexe d'un autre numéro.) Le nombre aléatoire sera une valeur à virgule flottante entre 0 et 1. Cela ne semble pas utile, mais avec un peu de mathématiques, vous pouvez convertir 0 à 1 de la valeur à toute autre gamme que vous souhaitez.

En plus de random () fonction, la Math objet a un certain nombre de fonctions qui vous permettent de convertir une valeur en virgule flottante (qui est, un nombre avec un point décimal) pour un entier (vous l'avez - un certain nombre sans un point décimal). Le standard parseInt () méthode est construite en javascript, mais parfois vous voulez faire une conversion colombophile. La bibliothèque Math a un certain nombre de ces outils:

  • Math.round (): Convertit un nombre en utilisant l'algorithme d'arrondissement classique. Si la partie décimale est 0,5 ou moins, le plus petit nombre entier est chosen- si la partie décimale est supérieure à 0,5, l'entier supérieur est choisi. Cela signifie que 3,1 à 3 tours et 3,8 à 4 tours.

  • Math.floor (): Cette fonction arrondit toujours vers le bas, de sorte que 3,1 et 3,8 fois deviennent 3. Le parseInt () fonction est identique à Math.floor ().

  • Math.ceil (): Cette fonction (l'obtenir - la fonction de plafond) arrondit toujours, donc 3,1 et 3,8 fois finissent comme 4.

La fonction dont vous avez besoin dépend des circonstances spécifiques.

Comment faire de la forme de jeu de HTML

Comme toujours, HTML constitue le fondement de tout programme javascript. La chose principale ici est la forme qui fournit l'interface utilisateur. Ce formulaire a quelques caractéristiques prévisibles:

  • Un laps de tenir les données brutes: Il n'y a vraiment rien pour l'utilisateur type, afin d'utiliser une durée pour les divers éléments de sortie. Travées sont une balise inline générique. Ils sont super pour ce genre de situations où vous avez besoin d'élément de sortie simple qui peut être en ligne avec le flux principal de la page. La durée de données brutes est appelé (ici vous allez...) spnRaw.

  • Un autre pour la durée times100 données: Comme le programme fait les calculs, il affichera la sortie.

  • Un troisième travée pour la sortie finale: Après tous les calculs sont terminés, vous devez trouver un moyen pour afficher votre travail brillant. spnFinal servira à cette fin.

  • Étiquettes à tout rendre clair: Sans étiquettes expliquant ce qui se passe, il y aura juste un tas de chiffres sur l'écran. Ne pas oublier d'ajouter des étiquettes, même à des exemples simples afin que l'utilisateur peut comprendre ce qui se passe.

  • Un bouton pour démarrer l'action: Rien ne se passera tant que l'utilisateur le demande, il faut donc ajouter un bouton à la forme. Lorsque le bouton est cliqué, faites appeler le rouleau () fonctionner à rouler un certain nombre.

  • CSS pour rendre tout l'air bien: HTML sans CSS est laid, il faut donc ajouter assez de CSS pour rendre le formulaire HTML regarder décent.


» » » » Comment créer des nombres aléatoires dans votre jeu de html5