How to delete a specific element from an array of JavaScript objects?

Question

I am receiving a JSON output from a php file, with a number of objects like so:

[
  { "home_content" : "Nam feugiat sem diam, ut fermentum orci hendrerit sit amet.",
    "home_id" : 2,
    "home_img" : "tech.png",
    "home_title" : "Latest Technologies Development"
  },
  { "home_content" : "לורם לורם",
    "home_id" : 239,
    "home_img" : "http://placehold.it/400",
    "home_title" : "שוק פירות וירקות"
  },
  { "home_content" : "New Item Content",
    "home_id" : 259,
    "home_img" : "http://www.placehold.it/100",
    "home_title" : "New Home Item"
  }
]

In my App I want to delete a certain object, is there a way to recieve its position say by home_id ? or anything that will let me differentiate a certain object from that list

You have an array of objects, you can iterate through the array, checking the `home_id` of each. — tymeJV, Aug 23 '13 at 15:55
What is your question, since it looks like you've actually asked two. Do you want to know how to *search* the array for specific object which matches a `home_id`, or do you want to *remove* an object from the array which matches the `home_id`? — BenM, Aug 23 '13 at 15:55
Yes this can easily be done. Have you tried to implement something and run into problems? — Mike Brant, Aug 23 '13 at 15:55
This isn't JSON! it's a valid javascript array literal, however. — John Dvorak, Aug 23 '13 at 15:57
This should be of help: http://stackoverflow.com/questions/500606/javascript-array-delete-elements — Himanshu Kumar, Aug 23 '13 at 15:57

score 3 · Accepted Answer · answered Aug 23 '13 at 15:55

3

What you have there is an array of objects, so you can just loop through the array until you find the one with the desired home_id:

var index;
for (index = 0; index < array.length; ++index) {
    if (array[index].home_id === 2) {
        array.splice(index, 1); // Removes this entry
        break;                  // Exits the loop
    }
}

answered Aug 23 '13 at 15:55

T.J. Crowder

1,031,962
187
1,923
1,875

Well thank you for pointing out that this is an 'array of objects'. I ended up looping through the array as you showed, but using coffeescript: for item, z in $scope.home – Nitsan Baleli Aug 24 '13 at 08:43

score 1 · Answer 2 · answered Aug 23 '13 at 15:55

What you have is an array (obtained from parsing JSON), so you'll have to find the correct index, and splice it:

function delObjWithHomeId(arr, id) {
    for(var i=0; i<arr.length; i++) {
        if(arr[i].home_id === id) {
            return arr.splice(i,1);
        }
    }
}

Chris Baker · Answer 3 · 2013-08-23T16:07:13.500

What you've posted there is an array of objects. That's an important distinction -- though in javascript, and array is a type of object.

An object, as you see, can have alphanumberic property names (indexes, if you will) that correspond to a data element. An array, by contrast, is numerically indexed, starting at 0. It is a lot like an object, but the property names are all numbers, and all in sequential order.

So, imagine your data like this:

{
0:{ 
home_id: 2
home_title: Latest Technologies Development
home_img: tech.png
home_content: Nam feugiat sem diam, ut fermentum orci hendrerit sit amet.
},
1:{ 
home_id: 239
home_title: שוק פירות וירקות
home_img: http://placehold.it/400
home_content: לורם לורם
},
2:{ 
home_id: 259
home_title: New Home Item
home_img: http://www.placehold.it/100
home_content: New Item Content
}
}

You can use a number of methods to manipulate an array, like push(), pop(), shift(). To access a specific one, you usually wind up looping it (unless you already know the correct index).

There are several methods to looping an array, while being one of the many possible approaches:

var i = 0;
while(var oneItem = myArray[i++]){
    if (oneItem.home_id == theItemIdIAmLookingFor) {
        myArray.splice(i, 1);
        break;
    }
}

Documentation

Arrays on MDN - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array
Objects on MDN - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object
Array.push on MDN - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push
Loop statements on MDN - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Statements#Loop_Statements

If you delete, you just remove property i, but you don't change the length. So it leaves a gap in the array. — bfavaretto, Aug 23 '13 at 16:05

How to delete a specific element from an array of JavaScript objects?

3 Answers3