JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptで1〜200の乱数を返す方法｜Math.random()とMath.floor()の使い方を解説

JavaScriptで1〜200の乱数を生成するには？

JavaScriptで1から200までの範囲のランダムな整数（乱数）を取得するには、Math.random()メソッドとMath.floor()メソッドを組み合わせて使用します。

仕組みのポイント

Math.random()は「0以上1未満」の浮動小数点数を返します。この値に200を掛けると「0以上200未満」の数値になり、Math.floor()で小数点以下を切り捨てると0〜199の整数が得られます。最後に+1を加算することで、目的である「1〜200の整数」を生成できるという流れです。

サンプルコード

以下のコードを実行すると、JavaScriptで1〜200のランダムな整数を画面に表示できます。

<!DOCTYPE html>
<html>
   <body>
      <script>
         document.write(Math.floor(Math.random() * 200) + 1);
      </script>
   </body>
</html>

応用：任意の範囲で乱数を取得する汎用関数

毎回コードを書き換えるのは手間なので、最小値と最大値を引数に取る関数としてまとめておくと便利です。

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

console.log(getRandomInt(1, 200)); // 1〜200のランダムな整数を出力

このように関数化しておけば、getRandomInt(50, 100)のように呼び出すだけで、どんな範囲でもランダムな整数を簡単に取得できます。サイコロや抽選機能など、さまざまな場面で活用できるので、ぜひ覚えておきましょう。

  1. JavaScriptで要素の表示・非表示を切り替える方法をわかりやすく解説

    Webページの開発では、ボタンのクリックに応じて特定の要素を表示したり非表示にしたりする「トグル（切り替え）処理」は非常によく使われるテクニックです。JavaScriptを使えば、style.displayプロパティの値を動的に変更することで、簡単にこの機能を実装できます。 本記事では、ボタンをクリックするたびにdiv要素の表示と非表示が切り替わるサンプルコードを紹介します。 実装のポイント 要素の表示・非表示の切り替えは、以下の手順で行います。 document.querySelector()で対象の要素を取得する addEventListener(click, ...)でボタンのクリック

  2. CSSとJavaScriptで「いいね／よくないね」ボタンを切り替える方法

    CSSとJavaScriptを組み合わせれば、クリックするたびに「いいね（サムズアップ）」と「よくないね（サムズダウン）」のアイコンが切り替わるボタンを簡単に実装できます。ここでは、Font AwesomeのアイコンとclassList.toggle()メソッドを使った具体的な実装例を紹介します。サンプルコード<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-aweso