JavaScriptでArray.prototype.slice()をオーバーライドして配列をスライスする方法

JavaScriptでは、標準の Array.prototype.slice() メソッドを独自の実装で上書きすることが可能です。通常、Array.prototype.slice() は「開始インデックス(start)」と「終了インデックス(end)」の2つの引数を受け取り、元の配列の start から end - 1 までの要素を抽出した部分配列を返します。

今回実装したいのは、この動作を変更し、end インデックスの要素も含めて start から end までの部分配列を返す slice() メソッドです。

実装の考え方

実装は以下の手順で行います。

• for ループを使って配列を反復処理する(for ループは多くの配列メソッドよりも高速に動作します)。
• start から end の範囲の要素を、新しい空の配列へ順番に追加していく。
• 最後に、作成した関数で Array.prototype.slice を上書きする。

コード例

const arr = [5, 5, 34, 43, 43, 76, 78, 3, 23, 1, 65, 87, 9];
const slice = function(start = 0, end = this.length-1){
    const part = [];
    for(let i = start; i <= end; i++){
        part.push(this[i]);
    };
    return part;
};
Array.prototype.slice = slice;
console.log(arr.slice(0, 4));
console.log(arr.slice(5, 8));
console.log(arr.slice());

出力結果

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

[ 5, 5, 34, 43, 43 ]
[ 76, 78, 3, 23 ]
[
    5, 5, 34, 43, 43, 76,
    78, 3, 23, 1, 65, 87,
    9
]

実装時の注意点

Array.prototype を直接変更すると、同じページ内で動作しているすべてのコードに影響が及ぶため、実際の開発では組み込みオブジェクトのプロトタイプを上書きすることは一般的に推奨されません。あくまで学習目的や特殊なユースケース向けのテクニックとして捉えておくとよいでしょう。

実務では、arr.slice(start, end + 1) のように呼び出し側で範囲を調整するか、組み込みメソッドを壊さずに済むよう独自のユーティリティ関数として定義する方が安全です。