How to delete an item from an array by attribute value?

Navigation
8

I have the following array with some items: 

var arr = [
    {id: 1, name: "Jon Snow"}, 
    {id: 2, name: "Michael Scolfield"}, 
    {id: 3, name: "Dexter Morgan"}
];

To add a new item, the push method is used. Exactly this way: 

arr.push({
  id: 1,
  name: "Jon Snow"
})

I noticed that it is possible to remove using the splice() method by passing the index as a parameter. See: 

arr.splice(index,1);

But I need to delete an item from array by passing the id parameter, which would be an attribute of the object. Example: 

function removeItem(id){
    //remover o objecto com id específico
}

How to delete an item from an array by passing its id parameter? What would be the best way to do this?

    
asked by anonymous 02.06.2017 / 16:55

4 answers

9

You need to find the element using the method filter , then just capture the index of the element using indexOf and remove it.

You can also create a new array only with elements that do not match your exclusion criteria. Note that in this approach the array original does not change . 

var arr = [
    {id: 1, name: 'Duplicado'}, 
    {id: 1, name: 'John Snow'}, 
    {id: 2, name: 'Michael Scolfield'}, 
    {id: 3, name: 'Dexter Morgan'}
];

removerPorId(arr, 1);
arr = removerPorId2(arr, 2);

console.log(arr);

// Opção 1
function removerPorId(array, id) {
  var result = array.filter(function(el) {
    return el.id == id;
  });
    
  for(var elemento of result){
    var index = array.indexOf(elemento);    
    array.splice(index, 1);
  }
}

// Opção 2
function removerPorId2(array, id) {
  return array.filter(function(el) { 
    return el.id !== id; 
  });
}
    
02.06.2017 / 16:58
10

Use filter . 

function removeItem(arr, refId) {
    return arr.filter(function(i) { return i.id !== refId; });
};
    
02.06.2017 / 17:04
3

I advise you to use the Lodash lib to manipulate Java Script. This lib packed with only the core has 4kb. It has several functionalities to manipulate items in javascript, I always use it in my projects, I recommend it. ;)

It would be as simple as this: 

var arr = [
    {id: 1, name: 'John Snow'},
    {id: 2, name: 'Michael Scolfield'}, 
    {id: 3, name: 'Dexter Morgan'}
];

// Objeto com o Dexter
console.log(arr);

// Remove Dexter
arr.splice(_.findIndex(arr, {id: 3}), 1);

// Objeto sem o Dexter
console.log(arr);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
    
02.06.2017 / 19:46
1

There are two ways to do this:

  • creating a new array with one less element
  • changing the current array

creating a new array with one less element

There are already answers that refer to some methods, but the fastest is using a for loop. ( test in jsPerf here ) 

function filtrar(arr, id) {
  var res = []
  for (var i = 0, j = arr.length; i !== j; i++) {
    if (arr[i].id !== id) res.push(arr[i]);
  }
  return res;
};

var arr = [
    {id: 1, name: 'John Snow'}, 
    {id: 2, name: 'Michael Scolfield'}, 
    {id: 3, name: 'Dexter Morgan'}
];

console.log(filtrar(arr, 1));

changing the current array 

function filtrar(arr, id) {

  for (var i = 0, j = arr.length; i !== j; i++) {
    if (arr[i].id === id) break;
  }
  arr.splice(i, 1);
};

var arr = [{
    id: 1,
    name: 'John Snow'
  },
  {
    id: 2,
    name: 'Michael Scolfield'
  },
  {
    id: 3,
    name: 'Dexter Morgan'
  }
];

filtrar(arr, 1);
console.log(arr);
    
02.06.2017 / 19:28
What is the most complete linux for programmers? [closed] Factorial Series of thehuxley.com site