勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

JavaScriptで特定の範囲内から数値が被らずにランダムに取り出す方法

   2024/05/22  JavaScript

1位から20位のランキング内でJavaScriptを用いてランダムに表示させたかった。つまり特定の範囲内から数値が被らずにランダムに取り出したい。以下にソースコードをメモ。

 

ソースコード

 

const array = [];
const limit = 5;
for( let i = 0; i < limit; i++ ){ //0~limitまでの整数を順番に配列に格納
    array[i] = i + 1;
}

const shuffle_array = []; //ランダムな数値を入れる配列の宣言
let random_key; //ランダムな数値を入れる変数の宣言

for( let i = 0; i < limit; i++ ){ // 0~limitまでループ
    random_key = Math.floor(Math.random()*array.length); //変数に指定した範囲(1-20)のランダムな整数値を入れる
    shuffle_array[i] = array[random_key]; //配列へ指定した範囲(1-20)のランダムな整数値を入れる
    array.splice(random_key, 1); //順番に整数を入れていた配列から、ランダム変数にあたる要素を削除
}
console.log(shuffle_array); //Array(5) [ 2, 3, 4, 5, 1 ]

 

参考サイト

http://himaxoff.blog111.fc2.com/blog-entry-43.html

 - JavaScript

  関連記事

「input type=
「input type="number"」のテキストボックスを桁数制限且つ半角数値のみ入力可にする方法

「input type="number"」のテキストボックスに対して「2桁まで」 ...

無料でシンプルなアイコンを設置できる「Feather」の利用方法
無料でシンプルなアイコンを設置できる「Feather」の利用方法

ページ上にアイコンを表示したい場合Font Awesomeを使うことが多いが、個 ...

さくらのレンタルサーバでCookieが正常に保存できない場合の対応方法
さくらのレンタルサーバでCookieが正常に保存できない場合の対応方法

さくらインターネットのレンタルサーバでjquery.cookie.jsを用いてC ...

jquery.cookie.jsで保存期間を時間指定する方法
jquery.cookie.jsで保存期間を時間指定する方法

jquery.cookie.jsで保存期間を1時間等、時間指定したい。公式サイト ...

Video.jsでテーマを指定して動画プレイヤーのデザインを変更する方法
Video.jsでテーマを指定して動画プレイヤーのデザインを変更する方法

Video.jsで動画プレイヤーのデザインを変更したい。調べたところWordPr ...