JavaScriptで配列から要素を削除するにはどうすればよいですか?


340
var arr = [1,2,3,5,6];

最初の要素を削除します

配列の最初の要素を削除して、次のようにします。

var arr = [2,3,5,6];

2番目の要素を削除する

この質問を拡張するには、次のようになるように配列の2番目の要素を削除したい場合はどうすればよいですか。

var arr = [1,3,5,6];

1
slice(start, end)'how_many_to_remove'で
seanjacob

2
@Ped arr.unshift()は削除されませんが、「配列の先頭に1つ以上の要素を追加します」
psycho brm

@seanjacobだと思いspliceませんslice
Animesh Sing

回答:


346

より柔軟なソリューションについては、splice()関数を使用してください。インデックス値に基づいて配列内のアイテムを削除できます。

var indexToRemove = 0;
var numberToRemove = 1;

arr.splice(indexToRemove, numberToRemove);

12
そして次の質問:arr.splice(1,1)2番目の要素について。
slebetman、2010年

1
私が好むsplice()以上shift()のより柔軟なので。将来は別のことをしたいと思うかもしれませんし、常に1つの要素だけ、あるいは最初の要素さえも削除したいとは限らないでしょう。
Gabriel McAdams

14
Googleからここに来る場合:Gabrielはこの回答を好みますが、shift()もあることに注意してください。Josephの回答を参照してください。
シェルナンデス2014

668

shift()あなたの状況に最適です。shift()配列から最初の要素を削除し、その要素を返します。このメソッドは、配列の長さを変更します。

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

array.shift(); // 1

array // [2, 3, 4, 5]

これは機能しますが、配列の最初の要素のみを削除します。
Gabriel McAdams、2010年

53
@Gabriel:まさにその質問ではなかったのですか?より明示的で直接的であるshift()ためsplice(..., ...)、私はそれを好みます。
Bruno Reis

6
修正:指定したリンクに従って、新しい配列から最初の要素を引いたものではなく、最初の要素を返します:)
DanH

コード例は正しいですが、説明は誤解を招きます。(a)@DanHが指摘するように、それは最初に返される要素であり、(b)入力配列が変更されているという事実は明確にされていません。したがって、ペッドの答えは優れています。
mklement0 2013年


61

このArray.prototype.shiftメソッドは、配列から最初の要素を削除し、それを返します。元の配列を変更します。

var a = [1,2,3]
// [1,2,3]
a.shift()
// 1
a
//[2,3]

4
Joseph Silvashyの回答が大幅に改善されました-説明とコードの間に矛盾はありません。
mklement0 2013年

48
arr.slice(begin[,end])

非破壊的で、スプライスとシフトにより元の配列が変更されます


3
非変異のためのうん。これはもっと見やすいはずです。
ユーザー

16

Javascript配列の任意の位置に要素を挿入および削除することに関する小さな記事を書きました。

以下は、任意の位置から要素を削除するための小さなスニペットです。これにより、JavaScriptのArrayクラスが拡張され、remove(index)メソッドが追加されます。

// Remove element at the given index
Array.prototype.remove = function(index) {
    this.splice(index, 1);
}

したがって、例の最初の項目を削除するには、arr.remove()を呼び出します。

var arr = [1,2,3,5,6];
arr.remove(0);

2番目のアイテムを削除するには、

arr.remove(1);

以下は、Arrayクラスの挿入メソッドと削除メソッドを含む小さな記事です。

基本的に、これはスプライスを使用した他の回答spliceと同じですが、名前は直感的ではなく、アプリケーション全体でその呼び出しがあると、コードが読みにくくなるだけです。



7

他の答えは素晴らしいです、私は単にES6Array関数を使用して別のソリューションを追加したかっただけです:filter

filter() 既存の配列から指定された基準に該当する要素を持つ新しい配列を作成します。

そのため、簡単に使用して、基準を満たさないアイテムを削除できます。この関数の利点は、文字列と数値だけでなく、複雑な配列にも使用できることです。

いくつかの例 :

最初の要素を削除

// Not very useful but it works
function removeFirst(element, index) {
  return index > 0;
}
var arr = [1,2,3,5,6].filter(removeFirst); // [2,3,4,5,6]

2番目の要素を削除します

function removeSecond(element, index) {
  return index != 1;
}
var arr = [1,2,3,5,6].filter(removeSecond); // [1,3,4,5,6]

奇数要素を削除

function removeOdd(element, index) {
  return !(element % 2);
}
var arr = [1,2,3,5,6].filter(removeOdd); [2,4,6]

在庫のないアイテムを削除する

const inventory = [
  {name: 'Apple', qty: 2},
  {name: 'Banana', qty: 0},
  {name: 'Orange', qty: 5}
];

const res = inventory.find( product => product.qty > 0);


2

ES6 Destructuring Assignment機能をRESTオペレーターと共に使用できます。カンマは、要素を削除する場所と、残りの(... arr)演算子を使用して配列の残りの要素を取得する場所を示します。

const source = [1,2,3,5,6];

function removeFirst(list) {
   var  [, ...arr] = list;
   return arr;
}
const arr = removeFirst(source);
console.log(arr); // [2, 3, 5, 6]
console.log(source); // [1, 2, 3, 5, 6]


1

Array.splice()最初の要素を削除するためにそれを使用できないという興味深い特性があります。したがって、私たちはに頼る必要があります

function removeAnElement( array, index ) {
    index--;

    if ( index === -1 ) {
        return array.shift();
    } else {
        return array.splice( index, 1 );
    }
}

3
Array.splice(0,1)は、最初の要素を削除します。ここでの他のすべての回答によると、developer.mozilla.org / en-US / docs / Web / JavaScript / Reference /…によると。また、なぜ最初の要素を削除するために-1を渡すのですか?彼らは0を渡しませんか?

渡されたとき、それは0にされているだろうので、私は0番目のインデックスのスプライスの妥当性について話すことはできませんが、ここでインデックスはそのチェックの前にデクリメントさ@skypecakes。
ジェイクT.

うん、それは間違いなく最初の要素を削除することができます。ここでテストしました:jsfiddle.net/sijpkes/d87rcLob/2
sijpkes

1

元の配列を変更しないTypescriptソリューション

function removeElementAtIndex<T>(input: T[], index: number) {
  return input.slice(0, index).concat(input.slice(index + 1));
}

1

配列から要素を削除するには、いくつかの方法があります。以下で最もよく使用されるオプションを指摘しておきます。これらのオプションすべてから何を使用するかについて適切な理由が見つからなかったので、私はこの回答を書いています。質問に対する答えは、オプション3(Splice())です。

1)SHIFT()-元の配列から最初の要素を削除し、最初の要素を返します

Array.prototype.shift()のリファレンスを参照してください。これは、最初の要素を削除する場合、および元の配列を変更しても問題がない場合にのみ使用してください。

const array1 = [1, 2, 3];

const firstElement = array1.shift();

console.log(array1);
// expected output: Array [2, 3]

console.log(firstElement);
// expected output: 1

2)SLICE()-開始インデックスと終了インデックスで区切られた配列のコピーを返します

Array.prototype.slice()のリファレンスをご覧ください。このオプションから特定の要素を削除することはできません。既存の配列のみをスライスして、配列の連続部分を取得できます。これは、指定したインデックスから配列を切り取るようなものです。元の配列は影響を受けません。

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

3)SPLICE()-特定のインデックスにある要素を削除または置換して、配列の内容を変更します。

Array.prototype.splice()のリファレンスを参照してください。splice()メソッドは、既存の要素を削除または置換したり、新しい要素を適切な場所に追加したりして、配列の内容を変更します。更新された配列を返します。元の配列が更新されます。

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

0

これは、reduceでも実行できます。

let arr = [1, 2, 3]

arr.reduce((xs, x, index) => {
        if (index == 0) {
            return xs
        } else {
            return xs.concat(x)
        }
    }, Array())

// Or if you like a oneliner
arr.reduce((xs, x, index) => index == 0 ? xs : xs.concat(x), Array())
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.