フィッシャーイェーツのシャッフル #JavaScript

フィッシャーイェーツのシャッフルとは？

現在、javascriptの簡単なアプリ開発を勉強しているのですが、ドットインストールでアプリ開発講座を受けていると、配列をランダムに組み替えて返すという興味深い関数を見つけたのでそれをまとめます。（ドットインストールの三択クイズで使用されていたので興味があればぜひ受講してみてください。）

フィッシャーイェーツのシャッフルとは簡単にいうと引数として指定された配列をランダムにならびかるアルゴリズムです。これを使ってクイズアプリ開発をしました。

実際にコードに書いてみよう

今回はjavascriptで書いていくことにします。

main.js

  const numbers = [1,2,3,4,5];

このように簡単に数字を並べた配列があったとしましょう。今回はこの数字の配列を並び替えてみたいと思います。フィッシャーイェーツのシャッフルを用いてコードを書くとこのような感じになります。

main.js

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

この関数では引数として配列が必要となっているのがわかるかと思います。引数として渡された配列の要素数が負になるまでループを回す処理が書かれています。ここで注目してもらいたいのがMath関数を使用している部分です。

Math.floor(Math.random() * (i + 1));という記述から０から引数として渡された配列の要素の数までの整数をランダムに選択して返すという処理を書く事ができます。

この書き方はドットインストールのjavascriptアプリ開発で頻繁に用いられていたので非常に汎用性が高い事がわかります。（私は何度もこの記述に出会ったのでもう覚えてしまいまいした。）

そして最後の処理には配列の最後の要素とランダムに選択された要素を入れ替えるという処理が書かれています。この処理が一つ終わるごとにiを減らしていき、マイナスになるまでこの処理を続けます。

これによって非常にランダム性の高い配列を生成する事ができるのです。

では実際にこの関数を使用してみましょう。

main.js

const shuffledNumbers = shuffle(numbers);
console.log(shuffledNumbers);

コンソールで確認します。ランダムに配列が生成されている事がわかるでしょう。

このようにランダムな配列を返したい時にはぜひフィッシャーイェーツのシャッフルのアルゴリズムを用いてみてください。

最後に

私の拙い説明をみていただきありがとうございます。もし間違い、指摘等ありましたらよろしくお願いいたします。