web-dev-qa-db-fra.com

Comment supprimer un objet d'un tableau avec JavaScript?

J'ai un objet JavaScript comme ceci:

id="1";
name = "serdar";

et j'ai un tableau qui contient de nombreux objets ci-dessus. Comment puis-je supprimer un objet de ce tableau comme celui-ci:

obj[1].remove();
40
mavera

Eh bien splice fonctionne:

var arr = [{id:1,name:'serdar'}];
arr.splice(0,1);
// []

N'utilisez PAS l'opérateur delete sur les tableaux.

Mais peut-être que vous voulez quelque chose comme ça?

var removeByAttr = function(arr, attr, value){
    var i = arr.length;
    while(i--){
       if( arr[i] 
           && arr[i].hasOwnProperty(attr) 
           && (arguments.length > 2 && arr[i][attr] === value ) ){ 

           arr.splice(i,1);

       }
    }
    return arr;
}

Juste un exemple ci-dessous.

var arr = [{id:1,name:'serdar'}, {id:2,name:'alfalfa'},{id:3,name:'joe'}];
removeByAttr(arr, 'id', 1);   
// [{id:2,name:'alfalfa'}, {id:3,name:'joe'}]

removeByAttr(arr, 'name', 'joe');
// [{id:2,name:'alfalfa'}]
120
BGerrissen

Si vous avez accès aux fonctions ES2015 et que vous recherchez une approche plus fonctionnelle, j'opterais pour quelque chose comme:

const people = [
  { id: 1, name: 'serdar' },
  { id: 5, name: 'alex' },
  { id: 300, name: 'brittany' }
];

const idToRemove = 5;

const filteredPeople = people.filter((item) => item.id !== idToRemove);

// [
//   { id: 1, name: 'serdar' },
//   { id: 300, name: 'brittany' }
// [

Attention cependant, filter() n'est pas en mutation, vous aurez donc un nouveau tableau.

Voir les notes du réseau de développeurs Mozilla sur le filtre .

36

Vous pouvez utiliser la méthode splice() ou l'opérateur delete

La principale différence est que lorsque vous supprimez un élément de tableau à l'aide de l'opérateur delete, la longueur du tableau n'est pas affectée, même si vous supprimez le dernier élément du tableau. D'autre part, la méthode splice() décale tous les éléments de sorte qu'aucun trou ne reste à la place de l'élément supprimé.

Exemple utilisant l'opérateur delete:

var trees = ["redwood", "bay", "cedar", "Oak", "maple"];  
delete trees[3];  
if (3 in trees) {  
   // this does not get executed  
}
console.log(trees.length);  //  5
console.log(trees);         //  ["redwood", "bay", "cedar", undefined, "maple"]

Exemple utilisant la méthode splice():

var trees = ["redwood", "bay", "cedar", "Oak", "maple"];  
trees.splice(3, 1);
console.log(trees.length);  //  4
console.log(trees);         //  ["redwood", "bay", "cedar", "maple"]
21
Daniel Vassallo

J'utilise cela un peu alors j'ai créé un petit prototype. Il suffit de chercher l'élément puis de le retirer s'il y a correspondance.

//Prototype to remove object from array, removes first
//matching object only
Array.prototype.remove = function (v) {
    if (this.indexOf(v) != -1) {
        this.splice(this.indexOf(v), 1);
        return true;
    }
    return false;
}

Peut s'appeler comme:

var arr = [12, 34, 56];
arr.remove(34);

Le résultat serait [12, 56]

A un retour booléen en cas de suppression réussie, false si l'élément n'existait pas.

9

Si vous connaissez l'index de l'objet dans le tableau, vous pouvez utiliser splice (), comme d'autres l'ont mentionné, à savoir:

var removedObject = myArray.splice(index,1);
removedObject = null;

Si vous ne connaissez pas l'index, vous devez le rechercher dans le tableau, c'est-à-dire:

for (var n = 0 ; n < myArray.length ; n++) {
    if (myArray[n].name == 'serdar') {
      var removedObject = myArray.splice(n,1);
      removedObject = null;
      break;
    }
}

Marcelo

4
Marcelo
  //K.I.S.S. method
  //(the setup/comments is/are longer than the code)
  //cards is a two dimensional array object
  //  has an array object with 4 elements at each first dimensional index
  //var cards = new Array()
  //cards[cards.length] = new Array(name, colors, cost, type)
  //Can be constructed with Associated arrays, modify code as needed.
  //my test array has 60 'cards' in it
  //  15 'cards' repeated 4 times each
  //  groups were not sorted prior to execution
  //  (I had 4 groups starting with 'U' before the first 'A')
  //Should work with any dimensionality as long as first
  //index controls sort order

  //sort and remove duplicates
  //Algorithm:
  //  While same name side by side, remove higher entry;
  //  assumes 'cards' with same name have same other data
  //  (otherwise use cards[i-1] === cards[i] to compare array objects).
  //Tested on IE9 and FireFox (multiple version #s from 31 up).
  //Also tested by importing array data from 5MB text file.
  //Quick execution
  cards.sort()
  for (i=1; i<cards.length-1; i++){
    while (cards[i-1][0] == cards[i][0]){
       cards.splice(i,1)
    }
  }
1
James V. Fields

var arr = [{id:1,name:'serdar'}, {id:2,name:'alfalfa'},{id:3,name:'joe'}];
var ind = arr.findIndex(function(element){
   return element.id===2;
})
if(ind!==-1){
arr.splice(ind, 1)
}
console.log (arr)

Veuillez noter que la méthode findIndex n'est pas prise en charge dans Internet Explorer, mais vous pouvez utiliser polyfill à partir de ici

1
Manoj Yadav

Utilisez la méthode splice .

(Au moins, je suppose que c'est la réponse, vous dites que vous avez un objet, mais le code que vous donnez ne crée que deux variables et il n'y a aucun signe de la manière dont le tableau est créé)

0
Quentin

Utilisez delete-keyword.

delete obj[1];

EDIT: Voir: La suppression d'éléments de tableau en JavaScript - delete vs splice Delete annulera le décalage mais ne supprimera pas complètement l'entrée. L'épissage serait correct comme l'a dit David.

0
Stefan Hoth
delete obj[1];

Notez que cela ne changera pas les index des tableaux. Tous les membres du groupe que vous supprimez resteront en tant que "logements" contenant undefined.

0
Tomalak

var apps = [{id: 34, nom: 'Mon application', un autre: 'chose'}, {id: 37, nom: 'Ma nouvelle application', un autre: 'choses'}];

// récupère l'index de l'objet avec l'id: 37

var removeIndex = apps.map (function (item) {return item.id;}). indexOf (37);

// enlève un objet

apps.splice (removeIndex, 1);

0
Suraj Sangani
var user = [
  { id: 1, name: 'Siddhu' },
  { id: 2, name: 'Siddhartha' },
  { id: 3, name: 'Tiwary' }
];

var recToRemove={ id: 1, name: 'Siddhu' };

user.splice(user.indexOf(recToRemove),1)
0
Siddhartha