読者です 読者をやめる 読者になる 読者になる

フロントサイドエンジニアという選択肢

HTMLコーダー → ECサイト運営 → システムエンジニア という経歴の著者がフロントサイトエンジニアという職業に今後の活路を見出し、その道に進むために取得した技術を貯めておくブログ

(JavaScript)spliceを使った配列操作

Javascriptの配列にはspliceという汎用的な関数があります。ちょっと変わった機能なのでメモしておきます。

似たような関数にconcatやsliceがありますが、こちらは操作の結果を戻り値で受け取るだけで、もとの配列には手を加えないのに対して、spliceは戻り値を渡すと同時に、もとの配列にも変更を加えます。
基本的な例として

var ary = [1,2,3,4,5,6]; 
var sub = ary.splice(0,3)

document.write(sub); // 1,2,3と表示
document.write(ary); // 4,5,6と表示

上記の例は、ary配列にspliceをかけることで引数の範囲の値を切り出し、引数としてsubに渡しています。 指定範囲外の値はaryに残ります。

spliceの引数には2つ以上の値を渡すことが出来ます。
第一引数は切り出す値の開始位置、第二引数には終了位置、そして第三引数以降は、切り出した部分に追加する値を指定することが出来ます。

var ary = [1,2,3,4,5,6]; 
var sub = ary.splice(0,3,'a','b','c')

document.write(sub); // 1,2,3と表示
document.write(ary); // a,b,c,4,5,6と表示