Gyakran a projektek kidolgozása során azon kapja magát, hogy véletlenszámok előállításának módját keresi.
A véletlenszerű számok generálásának leggyakoribb esetei a szerencsejátékok, mint a dobókocka, a kártyák keverése és a rulett kerekeinek forgatása.
Ebben az útmutatóban megtudhatja, hogyan lehet véletlen számot létrehozni a Math.random()módszer segítségével egy mini kockajáték felépítésével.
A Math.random () metódus
A MathJavaScript-ben található objektum egy beépített objektum, amely tulajdonságokkal és módszerekkel rendelkezik a matematikai számítások elvégzéséhez.
Az Mathobjektum általános felhasználása egy véletlen szám létrehozása a random()módszer segítségével.
const randomValue = Math.random();De a Math.random()módszer valójában nem ad egész számot. Ehelyett egy lebegőpontos értéket ad vissza 0 (beleértve) és 1 (kizáró) között. Ezenkívül vegye figyelembe, hogy a visszatérő érték Math.random()álvéletlenszerű.
A véletlenszerű számok Math.random()véletlenszerűnek tűnhetnek, de ezek a számok megismétlődnek, és végül nem véletlenszerű mintázatot jelenítenek meg egy ideig.
Az algoritmikus véletlenszám-generálás ugyanis soha nem lehet igazán véletlenszerű jellegű. Ezért hívjuk őket ál-véletlenszám-generátoroknak (PRNG).
Ha többet szeretne megtudni a Math.random()módszerről, nézze meg ezt az útmutatót.
Véletlenszám-generátor funkció
Most a Math.random()módszerrel hozzunk létre egy olyan függvényt, amely véletlenszerű egész számot ad vissza két érték között (beleértve).
const getRandomNumber = (min, max) => { return Math.floor(Math.random() * (max - min + 1)) + min; };Bontjuk le itt a logikát.
A Math.random()módszer egy lebegőpontos számot ad vissza 0 és 1 között (kizárva).
Tehát az intervallumok a következők lennének:
[0 .................................... 1) [min .................................... max)A második intervallum kiszámításához vonjon le mindkét végből min. Tehát ez 0 és 0 közötti intervallumot ad max-min.
[0 .................................... 1) [0 .................................... max - min)Tehát most egy véletlenszerű érték megszerzéséhez tegye a következőket:
const x = Math.random() * (max - min)Itt xvan a véletlenszerű érték.
Jelenleg maxki van zárva az intervallumból. Ahhoz, hogy inkluzív legyen, adjon hozzá 1-et. Ezenkívül hozzá kell adnia a minkorábban kivont hátlapot is, hogy értéket kapjon a között [min, max).
const x = Math.random() * (max - min + 1) + minRendben, így most az utolsó lépés marad annak biztosítása, hogy xez mindig egész szám legyen.
const x = Math.floor(Math.random() * (max - min + 1)) + minHasználhatja a Math.round()metódust a helyett floor(), de ez nem egyenletes eloszlást eredményez. Ez azt jelenti, hogy mindkettőnek maxés minfél esélye lesz kijönni eredményként. A használat Math.floor()tökéletesen egyenletes terjesztést eredményez.
Tehát most, hogy tisztában van azzal, hogyan működik egy véletlenszerű generáció, használjuk ezt a funkciót a dobókockák szimulálására.
A gördülő kockajáték
Ebben a részben létrehozunk egy igazán egyszerű mini kockajátékot. Két játékos írja be a nevét, és dobja a kockát. Az a játékos nyeri a fordulót, akinek a kockája nagyobb számmal rendelkezik.
Először hozzon létre egy funkciót, rollDiceamely szimulálja a kocka dobásának műveletét.
Bent a függvény törzsében, hívja a getRandomNumber()funkció 1és 6a érveket. Ez bármilyen véletlenszerű számot kap 1 és 6 között (mindkettőt beleszámítva), akárcsak a valódi kocka működése.
const rollDice = () => getRandomNumber(1, 6);Ezután hozzon létre két beviteli mezőt és egy gombot az alábbiak szerint:
Roll Dice Ha a 'Roll Dice' gombra kattint, keresse meg a játékos nevét a beviteli mezőkből, és hívja meg az rollDice()egyes játékosok függvényét.
const getRandomNumber = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min; const rollDice = () => getRandomNumber(1, 6); document.getElementById("roll").addEventListener("click", function () { // fetch player names from the input fields const player1 = document.getElementById("player1").value; const player2 = document.getElementById("player2").value; // roll dice for both players const player1Score = rollDice(); const player2Score = rollDice(); // initialize empty string to store result let result = ""; // determine the result if (player1Score > player2Score) { result = `${player1} won the round`; } else if (player2Score > player1Score) { result = `${player2} won the round`; } else { result = "This round is tied"; } // display the result on the page document.getElementById("results").innerHTML = ` ${player1} => ${player1Score}
${player2} => ${player2Score}
${result}
`; }); Ellenőrizheti a játékosok névmezejeit, és néhány CSS-szel finomíthatja a jelölést. A rövidség érdekében ezt az útmutatót egyszerűen megtartom.
Ez az. A bemutatót itt tekintheti meg.
Következtetés
Tehát véletlenszámok generálása a JavaScript-ben mégsem olyan véletlenszerű. Mindössze annyit csinálunk, hogy felveszünk néhány bemeneti számot, használunk némi matematikát, és kiköpünk egy ál-véletlenszerű számot.
A legtöbb böngészőalapú alkalmazás és játék esetében ez a sok véletlenszerűség elegendő és megfelel a céljának.
Ennyi az útmutatóhoz. Maradj biztonságban, és kódolj, mint egy vadállat.