javascript 从数组中删除项目

Question

I have "scene" with graphics "objects"...

Scene.prototype.objects=new Array();

Scene.prototype.add=function(obj){
  var last=this.objects.length;
  this.objects[last]=obj}

Scene.prototype.remove=function(obj){
  this.objects.splice(obj.id,1)}

Scene.prototype.advance=function(){
  for (var id in this.objects){
    var obj=this.objects[id];
    obj.id=id;
    obj.advance();
  }
}
Scene.prototype.paint=function(context){...}

each time creating and deleting many objects. Array.prototype.splice re-index array right? Does anyone know a better technique (adding and removing on javascript Array)?

In my opinion, is another possibility to do that something like

Scene.prototype.remove=function(obj){
  delete this.objects[obj.id]; // don,t care about this.objects.length
  delete obj; // not necessary...
}

I have not tried it yet...

I need a good book about JavaScript:)

Answer 1

Your delete method wouldn't work, because objects is an Array, and obj.id is the id of the object reference stored in an element in that Array. splice would be the method to use, but you'll have to know the index of the element in the Array. Maybe you should 'remeber' it this way:

Scene.prototype.add=function(obj){
  var last=this.objects.length;
  obj.objectsIndex = last;
  this.objects[last]=obj
}

After which you can:

Scene.prototype.remove=function(obj){
  this.objects.splice(obj.objectsIndex,1)};
  //reindex the objects within the objects Array
  for (var i=0; i<this.objects.length;i++){
     this.objects[i].objectsIndex = i;
  }
}

: Adding the objects Array to the prototype of your Scene constructor means it will be the same for all instances (static), is that what you want?

Answer 2

I'd rather avoid using new Array() instead use [] (page 114 of book I mentioned in comment - 'JavaScript: The Good Parts' by Douglas Crockford;)).

What's more, I don't think adding objects array to Scene prototype will work as you expect. You probably want to achieve some Object-Oriented structure, which requires some acrobatic skills in JavaScript, as it uses prototypal inheritance as it is class-free.

Try something like this:

var Scene = function(initial_objects) {
    this.objects = initial_objects || [];
};

Scene.prototype.add = function(obj) {
    this.objects.push(obj);
};

Scene.prototype.remove_by_index = function(index) {
    this.objects.splice(index, 1);
};

Scene.prototype.remove = function(obj) {
    var index = this.objects.indexOf(obj);
    if (index > -1) {
        this.objects.splice(index, 1);
    }
};

Read also this: http://javascript.crockford.com/inheritance.html

Answer 3

It seems you don't actually need an array for your objects. You can use another object has hash table:

(function() {

    var i = 0;

    Scene.prototype.objects = {};

    Scene.prototype.add = function(obj) {
      var id = i++;
      this.objects[id] = obj;
      obj.id = id;
    };

    Scene.prototype.remove = function(obj){
      if(obj.id in this.objects) {
          delete this.objects[obj.id];
      }
    };

    Scene.prototype.advance=function(){
      for (var id in this.objects){
        var obj=this.objects[id];
        obj.id=id;
        obj.advance();
      }
    };

    Scene.prototype.paint=function(context){...}

}());