Widely available すべての主要ブラウザで対応済み。安心して使用可能。

Array splice()

splice() は Array インスタンスのメソッドで、その場 (in-place) で既存の要素を取り除いたり、置き換えたり、新しい要素を追加したりすることで、配列の内容を変更します。

元の配列を変更せずに、ある部分を除去したり置き換えたりした新しい配列を作成するには toSpliced() を使用してください。配列を変更せずに配列の一部にアクセスするには slice() を参照してください。

配列ES1

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
Array.splice
1
12
1
1
18
1
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

JAVASCRIPT 
const arr = ['a', 'b', 'c', 'd'];

// Remove
arr.splice(1, 2); // Return value: ['b', 'c'], arr: ['a', 'd']

// Insertion
arr.splice(1, 0, 'x', 'y'); // arr: ['a', 'x', 'y', 'd']

// Replacement
arr.splice(1, 1, 'z'); // arr: ['a', 'z', 'y', 'd']

ライブデモ

要素の削除

指定した位置から特定の個数だけ要素を取り除きます。

プレビュー全画面表示

要素の挿入

削除個数を 0 にすることで、特定の場所に要素を差し込みます。

プレビュー全画面表示

要素の置換

削除と挿入を同時に行い、要素を入れ替えます。

プレビュー全画面表示

実務での使いどころ

  • Array splice() の活用

    splice() は Array インスタンスのメソッドで、その場 (in-place) で既存の要素を取り除いたり、置き換えたり、新しい要素を追加したりすることで、配列の内容を変更します。

注意点

  • 特になし。すべての主要ブラウザで安定して動作する。

アクセシビリティ

  • JavaScript による動的更新時は、aria-live リージョンで変更をスクリーンリーダーに通知する。

参考リンク