今回はJavascriptとJQueryを使用して重複しないランダム表示の一例をご紹介していきたいと思います。
spliceメソッドを使用して非常に短いソースコードで作成してみたので是非一読してみてください＼(^^)／
それではいってみましょう！
サンプルコード
1 2 3 4 5 6 7 8 9 10 11 | //① let ary = [1,2,3,4,5]; //② $.each(ary, function() { //③ let rndInt = Math.floor(Math.random() * ary.length); //④ console.log(ary.splice(rndInt,1)); }); // |
【結果】
解説
➀配列を作成します。（今回はわかりやすいように1～5の数字）
②eachメソッドで配列数だけループ処理をかけます。（ここはJQueryです）
③Mathオブジェクトで乱数を作成します。（④をループで実行するたびにlengthの数は1つずつ減っていきます）
④spliceメソッドで第1引数の削除位置にランダムな数字が入り第2引数の削除数に1を指定してループするたびに、ランダムなインデックスの要素が1つ削除され、その削除された要素を配列で取得します。
まとめ
今回は簡単な重複しないランダムデータを作成してみました。
やり方は色々ありますが、今回はspliceメソッドを使用し削除した要素を表示させていくという単純な方法でした(*^^)v
※今回作成できるデータは元データに重複がない場合の重複しないランダムデータ作成方法で、元データの重複を削除するといったものではないのでご注意ください。
以上です。
