Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【JavaScript ECMAScript】Array::Array.prototype.toSplicedインスタンスメソッドの使い方

Array.prototype.toSpliced()インスタンスメソッドの使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

Array.prototype.toSpliced()メソッドは、元の配列を変更することなく、指定された位置から要素の追加、削除、または置換を行った新しい配列を生成して返すメソッドです。このメソッドは、配列に対して非破壊的な操作を提供することが最大の特徴であり、元の配列の状態を保ちながら新たな配列を作成したい場合に非常に有用です。

具体的には、変更を開始するインデックス、その位置から削除する要素の数、そして追加したい任意の新しい要素を引数として指定できます。例えば、配列の途中に新しいデータ要素を挿入したり、特定の範囲の要素を削除したり、あるいは既存の要素を別の要素で置き換えたりすることが、元の配列に影響を与えずに実行可能です。

このメソッドを実行すると、指定された変更が適用された全く新しい配列が戻り値として得られます。これにより、配列の変更履歴を管理したい場合や、意図しないデータの変更を防ぎたい場合に、安全かつ効率的に配列操作を行うことができます。従来のsplice()メソッドが元の配列を直接変更するのに対し、toSpliced()メソッドは常に新しい配列を返すため、データの整合性を保ちながら柔軟なプログラミングを実現するための便利な手段として活用されます。

公式リファレンス: Array.prototype.toSpliced()

構文(syntax)

1const newArray = originalArray.toSpliced(startIndex, deleteCount, item1, item2);

引数(parameters)

start, deleteCount, ...items

  • start: number: 配列の変更を開始するインデックス
  • deleteCount: number: start から削除する要素の数
  • items: any[]: 配列に追加する要素

戻り値(return)

Array

このメソッドは、元の配列を変更せずに、指定されたインデックスから指定された数の要素を削除し、新しい配列を返します。

関連コンテンツ

関連プログラミング言語