配列の先頭n要素だけを部分的に反転する方法 – JavaScript

次のような配列リテラルがあるとします。

const arr = [3, 5, 5, 2, 23, 4, 7, 8, 8, 9];

ここでの課題は、このような配列と数値 n(n は配列の長さ以下である必要があります)を受け取り、配列の先頭 n 個の要素だけを反転させる JavaScript 関数を作成することです。

たとえば、上記の配列に対して数値が 4 の場合 −

const arr = [3, 5, 5, 2, 23, 4, 7, 8, 8, 9];

期待される出力は次のようになります。

const output = [2, 5, 5, 3, 23, 4, 7, 8, 8, 9];

先頭の 4 要素([3, 5, 5, 2])だけが反転され、残りの要素は元の順序のまま維持されている点に注目してください。

実装例

それでは、この関数のコードを見てみましょう。

const arr = [3, 5, 5, 2, 23, 4, 7, 8, 8, 9];
const partialReverse = (arr = [], num = 0) => {
    const partialArr = arr.slice(0, num);
    partialArr.reverse();
    arr.splice(0, num, ...partialArr);
};
partialReverse(arr, 5);
console.log(arr);

コードの解説

この関数は、以下の 3 つのステップで目的を実現しています。

• slice(0, num) − 元の配列から先頭 num 個の要素を新しい配列として切り出します(元の配列はまだ変更されていません)。
• reverse() − 切り出した部分配列を反転させます。
• splice(0, num, ...partialArr) − 元の配列の先頭 num 個の要素を、反転済みの部分配列で置き換えます。スプレッド構文(...)により、反転した要素を個別に展開して挿入できます。

なお、この関数は元の配列をその場で(in place)変更する点にも注意が必要です。元の配列を保持したい場合は、あらかじめ配列のコピーを作成しておきましょう。

出力

コンソールには次のような結果が出力されます。

[
    23, 2, 5, 5, 3,
    4, 7, 8, 8, 9
]

このように、slice()・reverse()・splice() を組み合わせることで、配列全体ではなく任意の範囲だけを効率的に反転させることができます。