JavaScript
多次元配列
配列

JavaScriptで配列から特定の要素を削除する方法

More than 1 year has passed since last update.

はじめに

配列から特定の要素を削除するにはいくつか方法があります。
単純に先頭の要素を削除するにはshift()で実現できます:

var ary = ['あ', 'い', 'う', 'え', 'お'];
console.log(ary.shift());  // => あ
console.log(ary);  // => ['い', 'う', 'え', 'お']

逆に最後の要素を削除するにはpop()で実現できます:

var ary = ['あ', 'い', 'う', 'え', 'お'];
console.log(ary.pop());  // => お
console.log(ary);  // => ['あ', 'い', 'う', 'え']

また一部の要素を取り出すのはslice()で実現できます:

var ary = ['あ', 'い', 'う', 'え', 'お'];
console.log(ary.slice(2, 4));  //  =>  ['う', 'え']
console.log(ary);  // => ['あ', 'い', 'う', 'え', 'お']

ここではsplice()を使って、もっと柔軟に好きな位置の要素を削除する方法をまとめてみます。
splice()の初歩的な使い方は次の通りです:

var ary = ['あ', 'い', 'う', 'え', 'お'];
console.log(ary.splice(1, 2));  // =>  ['い', 'う'](1番目から2つ取り出す)
console.log(ary);  // => ['あ', 'え', 'お'](取り出された後の配列)

1次元配列

例えば次の配列から1、2、4番目の要素を削除するとします:

['あ', 'い', 'う', 'え', 'お']

これは次のコードでできます:

var ary = ['あ', 'い', 'う', 'え', 'お'];
var exe = [1, 2, 4];    //削除したい位置(先頭が0であることに注意)
for(var i=0; i<exe.length; i++){
  ary.splice(exe[i]-i, 1);    //exe[i]-i番目から1つだけ削除
}

この結果、配列aryは次のように加工されます:

['あ', 'え']

ポイントは次の部分です:

ary.splice(exe[i]-i, 1);

for文で1周する度に配列が短くなっていくので、回った分だけ前に詰まります
それを考慮して、回った分だけ削除位置を前に詰めます。

2次元配列

配列が2次元になっても基本的には同じです。
2次元の場合は行を削除する場合と列を削除する場合があります。
行の方が簡単なので、まずは行から見ていきましょう。

行を削除

例えば次の配列から1、2、4行目を削除するとします:

[
  ['あ', 'い', 'う', 'え', 'お'],
  ['か', 'き', 'く', 'け', 'こ'],
  ['さ', 'し', 'す', 'せ', 'そ'],
  ['た', 'ち', 'つ', 'て', 'と'],
  ['な', 'に', 'ぬ', 'ね', 'の'],
]

これは次のコードでできます:

var ary = [
  ['あ', 'い', 'う', 'え', 'お'],
  ['か', 'き', 'く', 'け', 'こ'],
  ['さ', 'し', 'す', 'せ', 'そ'],
  ['た', 'ち', 'つ', 'て', 'と'],
  ['な', 'に', 'ぬ', 'ね', 'の'],
];
var exe = [1, 2, 4];    //削除したい位置(先頭が0であることに注意)
for(var i=0; i<exe.length; i++){
  ary.splice(exe[i]-i, 1);
}

この結果、配列aryは次のように加工されます:

[
  ['あ', 'い', 'う', 'え', 'お'],
  ['た', 'ち', 'つ', 'て', 'と'],
]

つまり行の削除は1次元の場合と全く同じコードで実現できます。

列を削除

ほんのちょっとだけレベルが上がります。
例えば次の配列から1、2、4列目を削除するとします。

[
  ['あ', 'い', 'う', 'え', 'お'],
  ['か', 'き', 'く', 'け', 'こ'],
  ['さ', 'し', 'す', 'せ', 'そ'],
  ['た', 'ち', 'つ', 'て', 'と'],
  ['な', 'に', 'ぬ', 'ね', 'の'],
]

これは次のコードでできます:

var ary = [
  ['あ', 'い', 'う', 'え', 'お'],
  ['か', 'き', 'く', 'け', 'こ'],
  ['さ', 'し', 'す', 'せ', 'そ'],
  ['た', 'ち', 'つ', 'て', 'と'],
  ['な', 'に', 'ぬ', 'ね', 'の'],
];
var exe = [1, 2, 4];    //削除したい位置(先頭が0であることに注意)
for(var i=0; i<ary.length; i++){    //このfor文で行を回す
  for(var j=0; j<exe.length; j++){
    ary[i].splice(exe[j]-j, 1);
  }
}

この結果、配列aryは次のように加工されます:

[
  ['あ', 'え'],
  ['か', 'け'],
  ['さ', 'せ'],
  ['た', 'て'],
  ['な', 'ね'],
]

ポイントはaryではなくary[i]に対してsplice()を実行することです。

さいごに

もっとスマートな方法をご存知の方は、ぜひ教えて下さい。