JavaScriptの配列からランダムに要素を取り出して削除する方法（配列が空になるまで繰り返す）

文字列や数値のリテラルからなる配列が与えられたとき、その配列を受け取り、ランダムに1つの要素を削除しながら同時にコンソールへ出力し、配列が空になるまでこの処理を繰り返す関数 removeRandom() を作成することを考えます。

この処理は、Math.random() を使って乱数を生成し、そのインデックスにある要素を Array.prototype.splice() で削除しながら出力することで実現できます。配列の長さが0になるまで while ループで繰り返すのがポイントです。

コード例

const arr = ['Arsenal', 'Manchester United', 'Chelsea', 'Liverpool',
'Leicester City', 'Manchester City', 'Everton', 'Fulham', 'Cardiff City'];

const removeRandom = (array) => {
    while(array.length){
        // 有効なインデックス範囲内のランダムな整数を生成
        const random = Math.floor(Math.random() * array.length);
        // その位置の要素を削除しつつ取得
        const el = array.splice(random, 1)[0];
        console.log(el);
    }
};
removeRandom(arr);

コードの解説

• Math.random()：0以上1未満のランダムな小数を返します。
• Math.floor(Math.random() * array.length)：配列の有効なインデックス範囲（0 ～ length-1）の整数を生成します。
• splice(random, 1)[0]：指定したインデックスから1つの要素を削除し、削除された要素を返します。[0] でその要素だけを取り出しています。

出力結果

コンソールへの出力は次のようになります。

Leicester City
Fulham
Everton
Chelsea
Manchester City
Liverpool
Cardiff City
Arsenal
Manchester United

注意 ― ランダムな順序で出力されるため、実行するたびに結果は異なります。上記は多くの可能性のある出力のほんの一例です。

補足：元の配列を保持したい場合

splice() は元の配列を直接変更する（破壊的な）メソッドです。元の配列を後で使い回したい場合は、スプレッド構文でコピーを作成してから関数に渡すと安全です。

removeRandom([...arr]); // 元のarrは変更されない