JavaScript Math Random

Dice rolls, shuffled quiz questions, random colors, loot drops, "pick a student": they all start with Math.random(). On its own it only gives a decimal between 0 and 1, so this lesson is mostly about turning that decimal into the kind of randomness you actually need.

// What Math.random() Gives You

Math.random()   // e.g. 0.7281947...
Math.random()   // e.g. 0.0412508...

Every call returns a new decimal that is at least 0 and less than 1. It can be exactly 0, but never exactly 1.

// Building a Random Whole Number, Step by Step

Math.random()                       // 0 to 0.999...
Math.random() * 6                   // 0 to 5.999...
Math.floor(Math.random() * 6)       // 0, 1, 2, 3, 4, or 5
Math.floor(Math.random() * 6) + 1   // 1, 2, 3, 4, 5, or 6  (a die!)

// The Function You Will Reuse Forever

function randInt(min, max) {       // both ends included
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

randInt(1, 6)       // die roll
randInt(1, 100)     // 1 to 100
randInt(-10, 10)    // negatives work too

The + 1 is what makes max reachable. Without it, randInt(1, 6) could never return 6.

// Is max Included?

There are two common versions of the random-integer function, and mixing them up is the classic off-by-one bug. The only difference is the + 1:

// min included, max EXCLUDED: good for array indexes
function randBelow(min, max) {
  return Math.floor(Math.random() * (max - min)) + min;
}

// min and max both INCLUDED: good for dice and 1-to-100 picks
function randInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

console.log(randBelow(0, 4));   // 0, 1, 2, or 3
console.log(randInt(0, 4));     // 0, 1, 2, 3, or 4

Here is what each common expression can produce:

Strictly speaking, JavaScript has no separate integer type: these are ordinary numbers that happen to have no decimals.

// Random Decimal in a Range

const randFloat = (min, max) => Math.random() * (max - min) + min;

randFloat(98.0, 99.5).toFixed(1)   // e.g. "98.7"

// Picking a Random Item

const students = ["Ava", "Ben", "Cal", "Dee"];

const pick = arr => arr[Math.floor(Math.random() * arr.length)];

console.log(`Next up: ${pick(students)}`);

Multiplying by arr.length gives indexes 0 to length - 1, exactly the valid positions.

// Chances and Coin Flips

const heads = Math.random() < 0.5;           // 50% true
const critical = Math.random() < 0.1;        // 10% true

if (critical) console.log("Critical hit!");

// Weighted Choices

When options should not be equally likely, walk through them subtracting weights:

const loot = [
  { item: "coin",   weight: 70 },
  { item: "potion", weight: 25 },
  { item: "sword",  weight: 5 }
];

function weightedPick(options) {
  const total = options.reduce((sum, o) => sum + o.weight, 0);
  let roll = Math.random() * total;
  for (const o of options) {
    if (roll < o.weight) return o.item;
    roll -= o.weight;
  }
}

weightedPick(loot);   // "coin" about 70% of the time, "sword" about 5%

// Checking That It Is Fair

Randomness is hard to eyeball. Run it many times and count:

const counts = [0, 0, 0, 0, 0, 0];
for (let i = 0; i < 60000; i++) {
  counts[randInt(1, 6) - 1]++;
}
console.log(counts);

// Not for Secrets

crypto.randomUUID()   // e.g. "3b241101-e2bb-4255-8caf-4136c566a962"

For shuffling a whole array fairly, use the Fisher-Yates shuffle from the Array Sort lesson.

// Quick Check

const colors = ["red", "green", "blue"];
console.log(colors[Math.floor(Math.random() * colors.length) + 1]);

// Try It

▶ Open Playground

1. Click Open Playground. Finish rollDice(n) so it rolls n six-sided dice and returns the total
2. Use pick to generate a random "adjective + animal" team name from two arrays
3. Open the fairness test with its Try it Yourself button, change it to Math.round(Math.random() * 6), and see the uneven ends
4. Make a random hex color: "#" + randInt(0, 0xFFFFFF).toString(16).padStart(6, "0")