Remove an item from an array by value

Question

I have an array of items like:

var items = [id: "animal", type: "cat", cute: "yes"]

And I'm trying to remove any items that match the ID given. In this case; animal

I'm stuck! I can get it to work easily by having a more simpler array but this is not what I need... I also need to remove the item by value as I don't want the hassle of referring to items by their index.

Is there a jQuery method I could use where I don't need to iterate through the items array, rather specify a selector?

Here is my jsFiddle: http://jsfiddle.net/zafrX/

Solution 1

I'm not sure how much of a hassle it is to refer to array items by index. The standard way to remove array items is with the splice method

for (var i = 0; i < items.length; i++)
    if (items[i] === "animal") { 
        items.splice(i, 1);
        break;
    }

And of course you can generalize this into a helper function so you don't have to duplicate this everywhere.

---

EDIT

I just noticed this incorrect syntax:

var items = [id: "animal", type: "cat", cute: "yes"]

Did you want something like this:

 var items = [ {id: "animal",  type: "cat", cute: "yes"}, {id: "mouse",  type: "rodent", cute: "no"}];

That would change the removal code to this:

for (var i = 0; i < items.length; i++)
    if (items[i].id && items[i].id === "animal") { 
        items.splice(i, 1);
        break;
    }

Solution 2

No need for jQuery or any third party lib for this, now we can use the new ES5 filter :

let myArray = [{ id : 'a1', name : 'Rabbit'}, { id : 'a2', name : 'Cat'}];
myArray = myArray.filter(i => i.id !== 'a1');

Solution 3

You can either use splice or run a delete yourself. Here's an example:

for (var i = 0; i < items.length; i ++) {
    if (items[i] == "animal") { 
        items.splice(i, 1);
        break;
    }
}

Solution 4

There's a simple way!

myItems.splice(myItems.indexOf(myItems.find(row => row.id == id)), 1);

Demo below:

// define function
function delete_by_id(id) {

  var myItems = [{
    id: 1,
    type: "cat",
    cute: "yes"
  }, {
    id: 2,
    type: "rat",
    cute: "yes"
  }, {
    id: 3,
    type: "mouse",
    cute: "yes"
  }];

  // before
  console.log(myItems);

  myItems.splice(myItems.indexOf(myItems.find(item => item.id == id)), 1);

  // after 
  console.log(myItems);

}

// call function
delete_by_id(1);

Solution 5

You should do it like this (make sure that you have the right syntax...you cannot have array with properties, but object inside {} and then you can iterate by keys and delete unwanted key):

var items = {id: "animal", type: "cat", cute: "yes"}
var removeItem = "animal"; // or with the ID matching animal...

for(var p in items){
    if(items[p] === removeItem)
        delete items[p]
}

And to answer you question, you cannot apply jquery selectors to javascript objects. The best you can do to avoid for loop is to use $.each (which is a loop written in a more "functional" way).

View more solutions

Comments

[Adam Rackis]

I think this might be the right answer. I missed OP's incorrect syntax.

[Saeed Zhiany]

Please include an explanation of how and why this solves the problem would really help to improve the quality of your post.