CODEWITHSUNDEEP
javascriptarrays
Cbas
Cbas

Reputation: 6213

JavaScript items disappearing from Array

I have an array called objs that holds all of my application objects. Objects get added and removed from this list depending upon what happens in the application.

I am having this problem where some objects disappear (or are overwritten) only sometimes. If I step through the add and remove functions, the app always runs as it should, however many times when it is run without the debugger, one or two objects that were added to the end of the list disappear from the list.

objects are added to the array like this:

this.objs[this.objs.length]=obj;

and are removed from the array like this:

for(var i=0;i<this.objs.length;i++)
     if(this.objs[i]==obj)
           return this.objs.splice(i,1);

I put this code at the end of my add and remove functions: 

console.log("add! ");
console.log(this.objs);

Linked is an image of a console log during a session where an object dissapeared: http://ilujin.com/error.png

The first 4 objects in the list shown at the top should remain in the list throughout the session, but the object at index 3 (highlighted in red), gets overwritten by the next object that gets added (highlighted in blue).

The other weird thing is that the second list shown already has all of the changes (4 objects removed and 1 added), even though the remove function has only been called once and the add function not at all.

This makes me conclude that the problem is timing - if one add hasn't finished before the next add is called, the first one will be overwritten. And all of the console prints are the same because they all happen before the console can read and print.

Does this makes sense? For some reason I thought JS never ran parallel code and only moved on to a new function when the last function finished. Is the problem that I'm using the length of the objs list as the new index when I add to the list?

How can I fix this issue? I can't figure it out, and the debugger and console have proven useless.

Here is the app: http://iioengine.com/neuro/study2.htm

you only need to enter an id and see if the instructions pop up. If they do, than its working and refresh. If they don't, that means that the Text Object got overwritten.

Upvotes: 2

Views: 1661

Answers (1)

Ben Jacobs
Ben Jacobs

Reputation: 2526

You would really be better served by using Javascript's array methods.

Add to array:

this.objs.push(obj);

Remove from array:

this.objs.splice(this.objs.indexOf(obj), 1);

Also, note that splice edits the original array and returns the elements that have been removed. It's hard to tell from your limited code sample, but that might also be causing issues.

Upvotes: 1

Related Questions