カテゴリ: JavaScript 更新日: 2025/12/01

JavaScriptのMath.random()で乱数を生成する方法を徹底解説!初心者でもわかるランダムな数の作り方

JavaScriptのMath.random()で乱数を生成する方法
JavaScriptのMath.random()で乱数を生成する方法

先生と生徒の会話形式で理解しよう

生徒

「先生、JavaScriptで“ランダムな数”を作ることってできますか?」

先生

「はい、もちろんできます!JavaScriptにはMath.random()というとても便利なメソッドがあって、これを使えば簡単に乱数(ランダムな数)を作ることができますよ。」

生徒

「乱数ってどういう意味なんですか?」

先生

「乱数とは“ランダム(不規則)な数”のことです。例えば、サイコロを振ると毎回違う目が出ますよね。そのような予測できない数をプログラムで作ることを“乱数を生成する”といいます。」

生徒

「なるほど!じゃあ、具体的にどうやって使うんですか?」

先生

「それでは、Math.random()の基本から順番に見ていきましょう!」

1. Math.random()とは?

1. Math.random()とは?
1. Math.random()とは?

Math.random()は、JavaScriptで0以上1未満のランダムな数を作るためのメソッドです。小数(しょうすう)として返されるのが特徴です。

基本的な使い方はとてもシンプルです。


console.log(Math.random());

0.4839271032849

このように、実行するたびに違う値が表示されます。0以上1未満(つまり1は含まれない)という点を覚えておきましょう。

2. 0〜nまでの乱数を作る

2. 0〜nまでの乱数を作る
2. 0〜nまでの乱数を作る

では、0〜9のように「整数の乱数」を作りたい場合はどうすればいいでしょうか?

そのときは、Math.random()に数字を掛け算して範囲を広げ、Math.floor()(切り捨てメソッド)で整数にします。


let num = Math.floor(Math.random() * 10);
console.log(num);

7

この場合、0〜9の間でランダムな整数が生成されます。Math.floor()を使うことで、小数部分を切り捨てて整数にしているのです。

3. 1〜nまでの乱数を作る

3. 1〜nまでの乱数を作る
3. 1〜nまでの乱数を作る

もし「サイコロの目のように1〜6の間の数」を作りたい場合は、次のように書きます。


let dice = Math.floor(Math.random() * 6) + 1;
console.log(dice);

3

+1しているのは、Math.random()が0を含むためです。掛け算した結果が0〜5の範囲になるので、そこに1を足して1〜6の範囲にしています。

このように、乱数の範囲をコントロールすることができます。

4. 任意の範囲で乱数を生成する

4. 任意の範囲で乱数を生成する
4. 任意の範囲で乱数を生成する

「5〜15の間でランダムな数を作りたい」というような場合も、少しの工夫でできます。


function getRandom(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

console.log(getRandom(5, 15));

12

max - min + 1で範囲を調整して、最後にminを足すことで、任意の最小値から最大値までの乱数が作れます。

この関数を使えば、どんな範囲でも自由に乱数を生成できます。

5. 小数の乱数を作る方法

5. 小数の乱数を作る方法
5. 小数の乱数を作る方法

もし「0〜10の間で小数点を含む乱数」が欲しい場合は、切り捨てずにそのまま掛け算すればOKです。


let randomDecimal = Math.random() * 10;
console.log(randomDecimal);

4.382049571

このように、Math.floor()を使わないと小数点を含んだ値になります。ゲームの確率計算やアニメーションのランダム効果などでよく使われます。

6. 乱数を使ってランダムな要素を選ぶ

6. 乱数を使ってランダムな要素を選ぶ
6. 乱数を使ってランダムな要素を選ぶ

Math.random()を使えば、配列(データのリスト)の中からランダムに要素を取り出すこともできます。


let colors = ["赤", "青", "緑", "黄", "黒"];
let randomIndex = Math.floor(Math.random() * colors.length);
let randomColor = colors[randomIndex];

console.log(randomColor);

このようにして、「ランダムで色を選ぶ」「くじを引く」「ランダムなメッセージを表示する」といった処理が簡単にできます。

7. 乱数の応用例:簡単なおみくじを作ってみよう

7. 乱数の応用例:簡単なおみくじを作ってみよう
7. 乱数の応用例:簡単なおみくじを作ってみよう

ここまで学んだ知識を使って、簡単なおみくじプログラムを作ってみましょう。


let results = ["大吉", "中吉", "小吉", "吉", "凶"];
let index = Math.floor(Math.random() * results.length);
console.log("今日の運勢は:" + results[index] + "です!");

今日の運勢は:中吉です!

実行するたびに結果が変わるので、毎日のおみくじのような楽しみ方ができます。

8. 乱数を使うときの注意点

8. 乱数を使うときの注意点
8. 乱数を使うときの注意点

Math.random()で生成される乱数は、厳密には「完全なランダム」ではなく、コンピュータが内部的に計算して作る「疑似乱数(ぎじらんすう)」です。

ただし、通常のプログラムでは十分にランダムに見えるため、ゲームやアニメーション、抽選などに使う分には問題ありません。

また、Math.random()は毎回違う値を返しますが、「完全に予測不可能な乱数」を扱いたい場合(たとえば暗号処理など)には別の仕組みが必要です。

9. まとめ:Math.random()でできること

9. まとめ:Math.random()でできること
9. まとめ:Math.random()でできること

ここまで紹介した内容を整理すると、Math.random()は以下のような使い方ができます。

目的 コード例 生成範囲
0〜1未満の小数Math.random()0.0〜0.999...
0〜nの整数Math.floor(Math.random() * n)0〜n-1
1〜nの整数Math.floor(Math.random() * n) + 11〜n
min〜maxの整数Math.floor(Math.random() * (max - min + 1)) + minmin〜max
配列からランダムに選ぶarr[Math.floor(Math.random() * arr.length)]配列内の要素

このように、Math.random()を使えば、JavaScriptでさまざまな「ランダム処理」を実現できます。ゲーム、抽選、動的なデザインなど、幅広い場面で役立つ重要なメソッドです。

カテゴリの一覧へ
新着記事
New1
TypeScript
TypeScriptでパスエイリアスを設定する方法!baseUrlとpathsでコードをスッキリ整理
New2
JavaScript
JavaScriptのfor文の書き方を初心者向けにやさしく解説
New3
JavaScript
JavaScriptの関数でよくあるエラーとその解決法まとめ
New4
JavaScript
JavaScriptのイベント処理でよくあるエラーとその対処法
人気記事
No.1
Java&Spring記事人気No1
JavaScript
JavaScriptのインストール方法まとめ!Windows・Mac・Linux別にステップ解説
No.2
Java&Spring記事人気No2
JavaScript
JavaScriptのマウスイベントの使い方(click, mouseoverなど)
No.3
Java&Spring記事人気No3
JavaScript
JavaScriptのtoStringとString関数の違いを初心者向けに解説
No.4
Java&Spring記事人気No4
JavaScript
JavaScriptの純粋関数(pure function)と副作用の違いを理解しよう
No.5
Java&Spring記事人気No5
JavaScript
JavaScriptプログラムの実行方法まとめ!ブラウザ・Node.js・コンソールの使い方
No.6
Java&Spring記事人気No6
JavaScript
JavaScriptで文字列をforループで1文字ずつ処理する方法!初心者向け解説
No.7
Java&Spring記事人気No7
TypeScript
TypeScript学習におすすめの無料教材・リファレンスサイト【初心者向け】
No.8
Java&Spring記事人気No8
TypeScript
TypeScriptの始め方:開発環境の構築手順【初心者向け】