How do I remove a particular element from an array in JavaScript?

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

const array = [1, 2, 3, 4, 5];

// インデックス2の要素を1つ削除
array.splice(2, 1);
console.log(array); // [1, 2, 4, 5]

// 値から削除する場合
const index = array.indexOf(4);
if (index > -1) {
  array.splice(index, 1);
}
console.log(array); // [1, 2, 5]

1
2
3
4
5
6

const array = [1, 2, 3, 4, 5];

// 3を除外した新しい配列
const newArray = array.filter(item => item !== 3);
console.log(newArray); // [1, 2, 4, 5]
console.log(array);    // [1, 2, 3, 4, 5]（元の配列は変更されない）

1
2
3
4
5

const array = [1, 2, 3, 4, 5];

const removed = array.pop();
console.log(removed); // 5
console.log(array);   // [1, 2, 3, 4]

1
2
3
4
5

const array = [1, 2, 3, 4, 5];

const removed = array.shift();
console.log(removed); // 1
console.log(array);   // [2, 3, 4, 5]

1
2
3
4
5
6
7

const array = [1, 2, 3, 4, 5];

delete array[2];
console.log(array);        // [1, 2, empty, 4, 5]
console.log(array.length); // 5（長さは変わらない）

// 穴が空くので非推奨

1
2
3
4
5

const array = [1, 2, 3, 4, 5];

// インデックス2を除外
const newArray = [...array.slice(0, 2), ...array.slice(3)];
console.log(newArray); // [1, 2, 4, 5]

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

const array = [1, 2, 3, 2, 4, 2, 5];

// filterで全て削除
const result = array.filter(item => item !== 2);
console.log(result); // [1, 3, 4, 5]

// ループで削除（後ろから）
for (let i = array.length - 1; i >= 0; i--) {
  if (array[i] === 2) {
    array.splice(i, 1);
  }
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];

// id: 2のユーザーを削除
const filteredUsers = users.filter(user => user.id !== 2);
console.log(filteredUsers);
// [{ id: 1, name: 'Alice' }, { id: 3, name: 'Charlie' }]

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

// 大量の要素がある場合

// 速い: filter（単純な走査）
const result = largeArray.filter(x => x !== target);

// 遅い: 複数回のsplice（都度配列を再構築）
for (let i = largeArray.length - 1; i >= 0; i--) {
  if (largeArray[i] === target) {
    largeArray.splice(i, 1);
  }
}

1
2
3
4
5
6
7

function removeElement<T>(array: T[], element: T): T[] {
  return array.filter(item => item !== element);
}

const numbers: number[] = [1, 2, 3, 4, 5];
const result = removeElement(numbers, 3);
// result: number[] = [1, 2, 4, 5]

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

// NG: インデックスがずれる
const array = [1, 2, 3, 4, 5];
array.forEach((item, index) => {
  if (item === 2 || item === 3) {
    array.splice(index, 1); // 3がスキップされる
  }
});

// OK: 逆順でループ
for (let i = array.length - 1; i >= 0; i--) {
  if (array[i] === 2 || array[i] === 3) {
    array.splice(i, 1);
  }
}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

// NG: 元の配列が変更される
const original = [1, 2, 3];
const index = original.indexOf(2);
original.splice(index, 1);

// OK: コピーしてから操作
const original = [1, 2, 3];
const copy = [...original];
const index = copy.indexOf(2);
copy.splice(index, 1);

// OK: filterを使用
const original = [1, 2, 3];
const result = original.filter(x => x !== 2);