Maison  >  Article  >  interface Web  >  Exemple JavaScript - Vous apprendre à mettre en œuvre les compétences de la fonction de mélange de cartes de poker_javascript

Exemple JavaScript - Vous apprendre à mettre en œuvre les compétences de la fonction de mélange de cartes de poker_javascript

WBOY
WBOYoriginal
2016-05-16 16:47:571286parcourir

Nous trions généralement les cartes tirées au hasard de la plus petite à la plus grande (je me souviens que quand j'étais enfant, je ne pouvais pas attraper deux jeux de cartes). Cet essai est juste pour me familiariser avec cette fonction. comme le tri des tableaux dans js.

Points de connaissance utilisés :

1. Créer des objets en mode usine

Méthode 2.js array sort()

Copier le code Le code est le suivant :

var testArr = [1, 3, 4 , 2] ;
testArr.sort(function (a,b) {
return a - b;
})
alert(testArr.toString());//1,2,3 ,4
testArr.sort(function (a, b) {
return b- a;
})
alert(testArr.toString());//4,3,2,1

3.js-Math.radom() nombre aléatoire

Math.random();//0-1 Le nombre aléatoire obtenu est supérieur ou égal à 0 et inférieur à 1

Utilisation de l'épissure de tableau 4.js

Copier le code Le code est le suivant :

//Le premier paramètre est la position de départ d'insertion
//Le deuxième paramètre est le nombre d'éléments à supprimer de la position de départ
//Le troisième paramètre est l'élément à insérer depuis la position de départ
//Exemple
var testArr = [1, 3, 4, 2];
testArr.splice(1, 0, 8);
alert(testArr.toString());//1,8,3,4,2

var testArr1 = [1, 3, 4, 2];
testArr1.splice(1, 1, 8);
alert(testArr1.toString());//1,8,3, 4,2

Utilisation du décalage du tableau 5.js

Copier le code Le code est le suivant :

// Supprimer le premier élément du tableau et retournez-le, le tableau Supprime le premier élément
//Exemple
var testArr = [1, 3, 4, 2];
var k= testArr.shift();
alert( testArr.toString()) ;//3,4,2
alert(k);//1

Avec ces connaissances de base, nous pouvons commencer à jouer aux cartes. Supposons qu'une seule personne tire les cartes au hasard. Chaque fois que nous tirons une carte, nous devons l'insérer dans les cartes dans notre main pour garantir l'ordre. .De l'enfance à l'âge adulte !

Étape 1 : Nous devons d'abord écrire une méthode pour produire des objets de cartes à jouer :

Copier le code Le code est le suivant :

/*Le mode usine crée diverses cartes
* number:Le numéro sur la carte
*type:La couleur de la carte
*/
var Cards = (function () {
var Card = function (number, type) {
this.number = number;
this.type = type;
}
fonction de retour (numéro, type) {
retourner une nouvelle carte (numéro, type);
}
>})()

Étape 2 : Créez des cartes à jouer, mélangez et stockez

Copier le code Le code est le suivant :

var RadomCards = [];//Matrice de stockage de cartes aléatoires
var MyCards = [];//Stockage des cartes tirées


//Suit 0-Spade 1-Club 2-Diamant 3-Cœur 4-Grand Fantôme 5-Petit Fantôme
//Les nombres 0-13 représentent les fantômes, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, J, Q, K;
function CreateCompeleteCard() {
var index = 2;
var arr = [];
for (var i = 0; i <= 13; i ) {
If (i == 0) {
arr[0] = nouvelles cartes (i, 4);
arr[1] = nouvelles cartes (i, 5);
} else {
pour ( var j = 0; j <= 3; j ) {
arr[index] = nouvelles cartes (i, j);
index ;
}
}
}
RadomCards = SortCards(arr);
Show();//Afficher la carte actuelle sur la page
}
//Mélangez les cartes
function SortCards(arr) {
arr .sort (fonction (a, b) {
                                                                              .
Étape 3 : Commencez à tirer des cartes. Lorsque vous tirez des cartes, nous devons d'abord déterminer la position d'insertion, puis insérer les nouvelles cartes dans la position désignée pour former une nouvelle séquence soignée


Copier le code

Le code est le suivant :

//Comment dessiner des cartes
function GetCards(CardObj) {
var k = InCardsIndex(MyCards, CardObj);//Considérez la position d'insertion
MyCards.splice(k, 0 , CardObj); // Insérer pour former une nouvelle séquence
}
/*[Obtenir la position où la carte doit être insérée]
*arr : La carte actuellement en main
*obj : La carte nouvellement tirée
*/
function InCardsIndex(arr, obj) {
var len = arr && arr.length || 0;
if (len == 0) {
return 0 ;
                                                                                                                                          Return 0 ;
}
} else {
var backi = -1;
for (var i = 0; i < len; i ) {

si (numéro d'objet <= arr [i].numéro) {
                                                                                                        if (backi == -1) {
                                                                              
         revenir en arrière ;
                                                                                                                                                               
D'accord ! Utilisez le bouton du code HTML pour commencer à piocher des cartes, et cliquez sur une carte à la fois ! et montre-le





Copier le code


Le code est le suivant :

function Start() {//Comment piochez des cartes, touchez-en une fois

if (RadomCards.length > 0) { GetCards(RadomCards.shift()); "Pas plus" ; lenNew = MyCards.length;

var html = "" ;

var html = ""; lenNouveau pour (var i = 0; i < lenOld; i ) { var html = "
< ;b> " RadomCards[i].type "-
" RadomCards[i].number "
"; }< ;div class='pai new'>" MyCards[i].type "-
" MyCards[i].number "";       }         document.getElementById("new").innerHTML=html;                                                                                          

Télécharger le code html et css

Copier le code Le code est le suivant :