JavaScriptでsplice()を使って配列の特定の位置の値を置き換える方法

JavaScriptで配列の特定の位置にある値を置き換えるには、splice()メソッドを使用します。splice()は、配列に対して要素の削除・置換・追加を同時に行える便利なメソッドです。第一引数に操作を開始するインデックス、第二引数に削除する要素数、第三引数以降に挿入する新しい要素を指定します。

サンプルコード

var changePosition = 2
var listOfNames = ['John', 'David', 'Mike', 'Sam', 'Carol']
console.log("Before replacing=");
console.log(listOfNames);
var name = 'Adam'
var result = listOfNames.splice(changePosition, 1, name)
console.log("After replacing=");
console.log(listOfNames)

上記のコードでは、インデックス2（3番目の要素）にある「Mike」を「Adam」に置き換えています。splice(2, 1, name)は「インデックス2から1つの要素を削除し、その位置に変数nameの値を挿入する」という処理を意味します。

このプログラムを実行するには、以下のコマンドを使用します。

node fileName.js

実行結果

ここでは、ファイル名をdemo154.jsとして実行します。実行すると、以下のような出力が得られます。

PS C:\Users\Amit\JavaScript-code> node demo154.js
Before replacing=
[ 'John', 'David', 'Mike', 'Sam', 'Carol' ]
After replacing=
[ 'John', 'David', 'Adam', 'Sam', 'Carol' ]

実行結果から、配列内の「Mike」が「Adam」に正しく置き換えられていることが確認できます。

なお、splice()は元の配列を直接変更する破壊的なメソッドである点に注意してください。戻り値として返されるのは削除された要素を含む配列であり、置き換え後の配列を取得したい場合は、元の配列が格納された変数を参照する必要があります。元の配列を変更せずに新しい配列を作成したい場合は、toSpliced()メソッド（ES2023以降）やmap()を活用する方法もあります。