2013-03-08 11 views
119

に基づいて配列要素を削除します。私はそうのようなオブジェクトの配列を持つオブジェクトのプロパティ

var myArray = [ 
    {field: 'id', operator: 'eq', value: id}, 
    {field: 'cStatus', operator: 'eq', value: cStatus}, 
    {field: 'money', operator: 'eq', value: money} 
]; 

どのように私は、その性質に基づいて特定のものを削除しますか?

フィールドプロパティとして 'money'を含む配列オブジェクトを削除するにはどうすればよいですか?

答えて

177

一つの可能​​性:

myArray = myArray.filter(function(obj) { 
    return obj.field !== 'money'; 
}); 

filterは、新しい配列を作成しますのでご注意ください。元の配列を参照する他の変数は、元の変数myArrayを新しい参照で更新しても、フィルタリングされたデータを取得しません。慎重に使用してください。

+5

'filter()'はInternet Explorer 9+ – jessegavin

+0

の@jessegavinでのみ利用可能です。私は機能を模倣している、良い* es5 shim *ライブラリがたくさんあることを言及しておきたいと思います。(あなたがレガシーブラウザをサポートしたい場合) – jAndy

+2

'filter()'は新しい配列を作成します。変数を再割り当てし、参照を持つ他のコード領域がないことを知ることができます。元の配列オブジェクトを特に変更する必要がある場合、これは機能しません。 –

52

アレイ全体を反復し、望ましくないものをspliceに出力します。あなたのアカウントに、配列のライブ本質を取る必要はありませんので、簡単に使用するために、逆方向反復:

for (var i = myArray.length - 1; i >= 0; --i) { 
    if (myArray[i].field == "money") { 
     myArray.splice(i,1); 
    } 
} 
+1

配列のライブの性質はどういう意味ですか? @Neit the Dark Absol – sisimh

+20

@sisimhもしあなたが反復ロジックの一部として長さを使って配列を転送し、その要素が削除されたり追加されたりして長さが変わると、配列の最後配列内のすべての項目に対して操作を実行しないでください。後方に行くと、移動する長さではなく静的な0のインデックスに向かって動作するため、その可能性はずっと低くなります。 – Klors

+1

@Klorsの説明に感謝します:) – sisimh

1

jAndyのソリューションは、おそらく最高のですが、フィルターに頼ることができない場合は、あなたのような何かを行うことができます:あなたはjQueryのを使用していない場合は、次の

var myArray = [ 
    {field: 'id', operator: 'eq', value: 'id'}, 
    {field: 'cStatus', operator: 'eq', value: 'cStatus'}, 
    {field: 'money', operator: 'eq', value: "money"} 
]; 

myArray.remove_key = function(key){ 
    var i = 0, 
     keyval = null; 
    for(; i < this.length; i++){ 
     if(this[i].field == key){ 
      keyval = this.splice(i, 1); 
      break; 
     } 
    } 
    return keyval; 
} 
+1

なぜだろう私はfilter()に頼ることができますか? – imperium2335

+2

これはJavaScript 1.6に含まれているため、IE8以降のブラウザではサポートされていません。 –

3

コードです。 Demo

var myArray = [ 
    {field: 'id', operator: 'eq', value: 'id'}, 
    {field: 'cStatus', operator: 'eq', value: 'cStatus'}, 
    {field: 'money', operator: 'eq', value: 'money'} 
]; 

alert(myArray.length); 

for(var i=0 ; i<myArray.length; i++) 
{ 
    if(myArray[i].value=='money') 
     myArray.splice(i); 
} 

alert(myArray.length); 

また、機能の多くを持っている下線ライブラリを使用することができます。

UnderscoreはここでjQueryのはgrepを使用して別のオプションがあります関数型プログラミングのサポート

+3

これはウェブ上で放置するのは非常に危険な例です...それはサンプルデータでは動作しますが、他のものでは動作しません。スプライス(i)は、値がお金である最初のインスタンス以降で始まる配列内のすべての要素を削除することを意味します。スプライス(i、1)に変更した場合、次のシーケンシャルアイテムを評価しないため、間違っています(iを減らす必要があります)。これは、配列の後方への削除操作を処理する必要があるためです。アイテムは処理する次のアイテムのインデックスを変更しません –

7

の多くを提供するJavaScript用のユーティリティベルトライブラリです。第3のパラメータとしてtrueを渡して、grepが関数に一致する項目を確実に削除するようにします。

users = $.grep(users, function(el, idx) {return el.field == "money"}, true) 

すでにArray.filterを使用するのではなく、有用である可能性である、その後何のシムが必要とされないのjQueryを使用している場合。

4

特定の要素のインデックスを取得するためにlodashのfindIndexを使用して、それを使用してスプライスすることができます。

myArray.splice(_.findIndex(myArray, function(item) { 
    return item.value === 'money'; 
}), 1); 
+0

配列はツリー構造ですか? – forgottofly

+0

@forgottofly tree structure?私はここの 'myArray'はオブジェクトの配列だと思います。 – Sridhar

+1

配列がツリー構造の場合var beforeDeleteOperationArray = [{"id":3.1、 "name": "テスト3.1"、 "activityDetails":[{"id":22、 "name": "テスト3.1"} 2335、 "test 23"}]}] id:23 – forgottofly

2
var myArray = [ 
    {field: 'id', operator: 'eq', value: id}, 
    {field: 'cStatus', operator: 'eq', value: cStatus}, 
    {field: 'money', operator: 'eq', value: money} 
]; 
console.log(myArray.length); //3 
myArray = $.grep(myArray, function(element, index){return element.field == "money"}, true); 
console.log(myArray.length); //2 

要素は、アレイ内のオブジェクトです。 第3パラメータtrue手段は、関数ロジックに失敗した要素の配列を返します。falseは、関数ロジックに失敗した要素の配列を返します。

+1

あなたの解決策ははっきりしています。ありがとう –

関連する問題