JavaScript 配列からランダムな項目を取得する方法：Math.random、Fisher-Yates シャッフル、Underscore.js

JavaScript 配列からランダムな項目を取得する方法

Math.random() を使用する方法

概要:

• Math.random() 関数は、0 から 1 までのランダムな浮動小数点数を生成します。
• 配列の長さを Math.random() 関数の生成結果に乗じて、ランダムなインデックスを取得します。
• 配列の [] 演算子を使用して、ランダムなインデックスで指定された項目を取得します。

例:

const fruits = ["apple", "banana", "orange", "grape"];

const randomIndex = Math.floor(Math.random() * fruits.length);
const randomFruit = fruits[randomIndex];

console.log(randomFruit); // 例: "banana"

注意点:

• Math.random() 関数は、0 を含む 1 未満の値を生成します。そのため、配列の長さを Math.random() 関数の生成結果に乗じてそのままインデックスとして使用すると、最後の項目が選択されない可能性があります。
• 上記の例では、Math.floor() 関数を使用して、ランダムなインデックスを整数に丸めています。

Fisher-Yates シャッフルアルゴリズムを使用する方法

• Fisher-Yates シャッフルアルゴリズムは、配列の要素をランダムに並べ替えるアルゴリズムです。
• シャッフルされた配列から最初の要素を取得することで、ランダムな項目を取得することができます。

const fruits = ["apple", "banana", "orange", "grape"];

function shuffle(array) {
  for (let i = array.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [array[i], array[j]] = [array[j], array[i]];
  }
}

shuffle(fruits);
const randomFruit = fruits[0];

console.log(randomFruit); // 例: "banana"

• Fisher-Yates シャッフルアルゴリズムは、配列を完全にシャッフルするため、ランダムな項目を取得する以外に、配列の順序を入れ替える必要がある場合にも使用できます。

その他のライブラリを使用する方法

• Underscore.js や Lodash などの JavaScript ライブラリには、ランダムな項目を取得するための関数を提供しているものがあります。
• これらのライブラリを使用すると、より簡潔なコードでランダムな項目を取得することができます。

const fruits = ["apple", "banana", "orange", "grape"];

const _ = require("underscore");

const randomFruit = _.sample(fruits);

console.log(randomFruit); // 例: "banana"

• これらのライブラリを使用するには、事前にライブラリのインストールが必要です。

JavaScript で配列からランダムな項目を取得するには、いくつかの方法があります。上記で紹介した方法を参考に、状況に合わせて適切な方法を選択してください。

補足

• 上記の例では、配列からランダムな項目を取得するだけでしたが、ランダムな項目に対して何らかの処理を行うこともできます。
• 例えば、ランダムな画像を表示したり、ランダムな商品を推薦したりすることができます。

Math.random() を使用する方法

const fruits = ["apple", "banana", "orange", "grape"];

const randomIndex = Math.floor(Math.random() * fruits.length);
const randomFruit = fruits[randomIndex];

console.log(randomFruit); // 例: "banana"

Fisher-Yates シャッフルアルゴリズムを使用する方法

const fruits = ["apple", "banana", "orange", "grape"];

function shuffle(array) {
  for (let i = array.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [array[i], array[j]] = [array[j], array[i]];
  }
}

shuffle(fruits);
const randomFruit = fruits[0];

console.log(randomFruit); // 例: "banana"

Underscore.js を使用する方法

const fruits = ["apple", "banana", "orange", "grape"];

const _ = require("underscore");

const randomFruit = _.sample(fruits);

console.log(randomFruit); // 例: "banana"

Lodash を使用する方法

const fruits = ["apple", "banana", "orange", "grape"];

const _ = require("lodash");

const randomFruit = _.sample(fruits);

console.log(randomFruit); // 例: "banana"

その他の方法

上記以外にも、以下のような方法でランダムな項目を取得することができます。

• Array.prototype.sort() メソッドを使用して、配列をランダムに並べ替えてから、最初の要素を取得する。

JavaScript 配列からランダムな項目を取得するその他の方法

const fruits = ["apple", "banana", "orange", "grape"];

fruits.sort(() => Math.random() - 0.5);

const randomFruit = fruits[0];

console.log(randomFruit); // 例: "banana"

• この方法は、配列の順序を変更してしまうため、注意が必要です。

const fruits = ["apple", "banana", "orange", "grape"];

const randomFruit = fruits.filter(() => Math.random() < 0.5)[0];

console.log(randomFruit); // 例: "banana"

• この方法は、ランダムな条件を定義する必要があるため、複雑な場合もあります。

const fruits = ["apple", "banana", "orange", "grape"];

const _ = require("underscore");

const randomFruit = _.sample(fruits);

console.log(randomFruit); // 例: "banana"