JavaScriptで配列をn要素分回転させる方法

JavaScriptでは、配列と数値 n を引数に受け取り、その配列を n 要素分回転させる関数を作成することができます。本記事では、その実装方法を具体的なコード例とともに解説します。

処理の概要

例として、次の入力配列を考えてみましょう。

const arr = [12, 6, 43, 5, 7, 2, 5];

この配列を n = 3 だけ回転させると、先頭の3つの要素が末尾へ移動し、出力は以下のようになります。

const output = [5, 7, 2, 5, 12, 6, 43];

コード例

以下は、配列のプロトタイプに rotateBy メソッドを追加して実装した例です。

// 回転処理
const arr = [12, 6, 43, 5, 7, 2, 5];
const rotateByOne = arr => {
   for(let i = 0; i < arr.length-1; i++){
      temp = arr[i];
      arr[i] = arr[i+1];
      arr[i+1] = temp;
   };
}
Array.prototype.rotateBy = function(n){
const { length: l } = this;
   if(n >= l){
       return;
   };
   for(let i = 0; i < n; i++){
       rotateByOne(this);
   };
};
const a = [1,2,3,4,5,6,7];
a.rotateBy(2);
console.log(a);

コードの解説

rotateByOne 関数

rotateByOne は、隣り合う要素同士を順番に入れ替えることで、配列全体を1つ左方向へシフトする補助関数です。ループの中で一時変数 temp を使って要素をスワップしていくため、結果として先頭の要素が末尾へ移動します。

rotateBy メソッド

Array.prototype.rotateBy は、指定された回数 n 分だけ rotateByOne を繰り返し呼び出すことで、配列を n 要素分回転させます。また、n が配列の長さ以上の場合は何もせずに処理を終了するガード節が設けられています。

実行結果

上記のコードを実行すると、コンソールには以下のように出力されます。元の配列 [1, 2, 3, 4, 5, 6, 7] の先頭2要素が末尾へ回転していることが確認できます。

[
 3, 4, 5, 6,
 7, 1, 2
]