JavaScript で配列からインデックスを削除する

Harshit Jindal 2023年10月12日
  1. JavaScript で splice() 関数を使用して配列から特定の要素を削除する
  2. JavaScript で Array.filter() を使用して配列から特定の要素を削除する
  3. JavaScript で Underscore.js ライブラリを使用して配列から特定の要素を削除する
  4. JavaScript で Lodash ライブラリを使用して配列から特定の要素を削除する
JavaScript で配列からインデックスを削除する

このチュートリアルでは、JavaScript の配列から特定の要素を削除する方法を説明します。

JavaScript で splice() 関数を使用して配列から特定の要素を削除する

splice() メソッドは、要素を追加/削除することで配列の内容を変更できます。次の 3つの引数を取ります。

  1. index:要素を追加/削除する位置を指定する整数値。負のインデックスを使用して、配列の後ろからインデックスを指定することもできます。
  2. howmany:これはオプションのパラメーターです。配列から削除されるアイテムの数を指定します。0 に設定されている場合、アイテムは削除されません。
  3. item1, item2, ... ,itemx:配列に追加されるアイテム。
const array = [1, 2, 3, 4, 5];
const index = array.indexOf(3);
if (index > -1) {
  array.splice(index, 1);
}
console.log(array);

出力:

[1, 2, 4, 5]

上記のコードでは、最初に削除する要素のインデックスを見つけてから、splice() メソッドを使用して配列要素を削除します。

JavaScript で Array.filter() を使用して配列から特定の要素を削除する

filter メソッドは配列をループし、特定の条件を満たす要素をフィルターで除外します。これを使用して、ターゲット要素を削除し、残りを保持することができます。複数の要素を同時に削除するのに役立ちます。

var toRemove = 1;
var arr = [1, 2, 3, 4, 5];
arr = arr.filter(function(item) {
  return item !== toRemove
});
console.log(arr)

出力:

[2, 3, 4, 5]

filter 関数を使用して、削除する要素と等しくないすべての要素を保持し、新しく形成された配列を元の配列に割り当てます。

JavaScript で Underscore.js ライブラリを使用して配列から特定の要素を削除する

Underscore.js は、組み込みオブジェクトを拡張せずに多くの便利な関数を提供する非常に便利なライブラリです。JavaScript 配列からターゲット要素を削除するには、without() 関数を使用する必要があります。この関数は、ターゲット要素のすべてのコピーが削除された配列のコピーを返します。

const arr = [1, 2, 1, 0, 3, 1, 4];
arr = _.without(arr, 0, 1);
console.log(arr);

出力:

[2, 3, 4]

上記のコードでは、削除する配列と要素 01without 関数に渡します。これらの要素が削除された新しい配列が返され、arr に再度格納されます。

JavaScript で Lodash ライブラリを使用して配列から特定の要素を削除する

Lodash は、完全なライブラリではなく、必要な関数のみをインポートできる優れたライブラリです。配列から特定の要素を削除できる remove() という名前の関数があります。この関数は、配列と、配列から削除される要素に一致する条件をチェックする関数を受け取ります。

var arr = [1, 2, 3, 4];
var greater = _.remove(arr, function(n) {
  return n > 2;
});
console.log(arr)

出力:

[1,2]

上記のコードでは、配列と、要素が 2 より大きいかどうかをチェックする関数を lodash ライブラリの remove 関数に渡します。2 より大きいすべての要素を配列から削除します。

著者: Harshit Jindal
Harshit Jindal avatar Harshit Jindal avatar

Harshit Jindal has done his Bachelors in Computer Science Engineering(2021) from DTU. He has always been a problem solver and now turned that into his profession. Currently working at M365 Cloud Security team(Torus) on Cloud Security Services and Datacenter Buildout Automation.

LinkedIn

関連記事 - JavaScript Array