CODEWITHSUNDEEP
javascriptarraysloopsobjectunderscore.js
Patrick
Patrick

Reputation: 4298

Add value into an array of Objects

I have this array of objects that i display on the UI table. It has 3 columns with name, contact and id.

[Object, Object, Object]
0:Object
    name: "Rick"
    Contact: "Yes"
    id: 1
1:Object
    name:"Anjie"
    Contact:"No"
    id: 2
2:Object
    name:"dillan"
    Contact:"Maybe"
    id:3

Now, i add a new row to the top of table. So the newly added row into the array of objects, would look like this.

[Object, Object, Object,Object]
0:Object  //newly added row. Since new row is added, it doesnt have any data.
 name: ""
 Contact: ""
 id: 
1:Object
 name: "Rick"
 Contact: "Yes"
 id: 1
2:Object
 name:"Anjie"
 Contact:"No"
 id: 2
3:Object
 name:"dillan"
 Contact:"Maybe"
 id:3

I want the array of objects to look like this instead of above one. 

[Object, Object, Object,Object]
0:Object  //newly added row. Since new row is added, it doesnt have any data.
 name: ""
 Contact: ""
 id: 4        
1:Object
 name: "Rick"
 Contact: "Yes"
 id: 1
2:Object
 name:"Anjie"
 Contact:"No"
 id: 2
3:Object
 name:"dillan"
 Contact:"Maybe"
 id:3

The only change is id value at 0th object. You can see i entered it as 4. It will check the max value in array of objects for id. In this case, it is 3. So it will increment by 1 and put it as the id value for newly added row.

Can someone let me know how to achieve this please.

Also, I had one more query.

If my id values are as follows. 

1
2
3
4
5
6

And i delete 4 and 5. So new rows will be

1
2
5
6

Here, it will check max length as 4 and add id value of 5 to newly row. it will look somewhat like this.

5
1
2
5
6

In this case, 5 is repeated. I dont want this. I instead would like to see which is the highest value given to id, and then increment the id according to it. So it should look like this.

7
1
2
5
6

Upvotes: 1

Views: 119

Answers (3)

pparas
pparas

Reputation: 549

If you only care about the ID being unique, you can add the timestamp as the ID

Lets assume that your array is called peopleContact your code to add the item in the array of objects would look something like the following.

var person= new Object();
person.name= "";
person.Contact= "";
person.id = Date.now();

peopleContact.push(person);

Upvotes: -1

MTL-VRN
MTL-VRN

Reputation: 393

If I understand you correctly, you simply want to run: 

array[0].id = array.length;

immediately after adding the row. Alternatively, if you can control the values of the object representing the new row when it is added, you could add the row as:

{
  name:"",
  Contact:"",
  id: array.length + 1
}

EDIT:

In response to your edit, showing that rows of the array can be deleted.

In that case, to get the ID value, you have a number of options.

One is to go through all members of the array at time of deletion, and reduce the id of all rows which have an id greater than the deleted row. This is probably the best solution.

Example code:

var delete = function(array, idToDelete) {
  for(var i = 0; i < array.length; i += 1) {
    if(array[i].id === idToDelete) {
      array.splice(i, 1);
    } else if (array[i].id > idToDelete) {
      array[i].id = array[i].id - 1;
    }
  }
}

If, for whatever reason, this is not an option, I would reccommend iterating through the array to find the highest ID in it, and adding 1.

var newId = array[0].id;
for(var i = 0; i < array.length; i += 1) {
  if(array[i].id > newId) {
    newId = array[i].id;
  } 
}
array.splice(0, 0, {name:"", Contact:"", id: newId + 1});

Upvotes: 4

Alnitak
Alnitak

Reputation: 339836

You can use this to find the next highest ID available (assuming that it's not trivially always equal to the length of the array):

var newID = 1 + myArray.reduce(function(p, c) {
    return Math.max(c.id, p);
}, 0);

where myArray is your array.

In ES6 you could use:

var newID = 1 + myArray.reduce((p, c) => Math.max(c.id, p), 0)

Upvotes: 3

Related Questions