javascript - 地图的最后一个条目没有被删除？(Last entry of Map not getting deleted?)

Question

As a forward, I'm attempting to create an entity/component/system design for a game.

(作为前进，我正在尝试为游戏创建实体/组件/系统设计。)

The first thing I'm trying is to handle entity creation and deletion.

(我要尝试的第一件事是处理实体的创建和删除。)

I opted to try to use a native Map for this.

(我选择尝试为此使用本机地图。)

For some reason when I run this code, I see expected behavior until I reach the last element of the map where I see it's update being called several times over when the entry is seemingly not getting removed.

(出于某种原因，当我运行此代码时，我看到了预期的行为，直到到达地图的最后一个元素为止，在该元素中，似乎没有删除条目时，多次调用了该更新。)

code:

(码：)

---

class Vector{
   constructor(x, y){ this.x = x; this.y = y; }
}

class Enemy{
   constructor(id, x, y){
      this.id = id;
      this.pos = new Vector(x, y)
   }
   update(){
      this.pos.x++;
      console.log(Game.entities)
      if (this.pos.x > 10) Game.dispatch(this.id)
   }
}

const Game = {
    start: function(){
       this.entities = new Map;
       for (let i = 0; i<5; i++){
            const sid = Math.random();
            this.entities.set(sid, new Enemy(sid, i*20, 20))
       }
       this.tick(0)
    },
    dispatch: function(id){
        this.entities.delete(id)
    },
    tick: function(){
        for (let entity of this.entities.values()) {
            entity.update();
        }
        setTimeout(this.tick.bind(this), 100)
    }
}
Game.start()

Expected output:

(预期产量：)

---

test.js:12 Map(5) {0.5025040680322241 => Enemy, 0.42078144104682513 => Enemy, 0.26799686976172143 => Enemy, 0.7289429408250698 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(5) {0.5025040680322241 => Enemy, 0.42078144104682513 => Enemy, 0.26799686976172143 => Enemy, 0.7289429408250698 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(4) {0.5025040680322241 => Enemy, 0.26799686976172143 => Enemy, 0.7289429408250698 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(3) {0.5025040680322241 => Enemy, 0.7289429408250698 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(2) {0.5025040680322241 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}

Actual output:

(实际输出：)

---

test.js:12 Map(5) {0.5025040680322241 => Enemy, 0.42078144104682513 => Enemy, 0.26799686976172143 => Enemy, 0.7289429408250698 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(5) {0.5025040680322241 => Enemy, 0.42078144104682513 => Enemy, 0.26799686976172143 => Enemy, 0.7289429408250698 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(4) {0.5025040680322241 => Enemy, 0.26799686976172143 => Enemy, 0.7289429408250698 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(3) {0.5025040680322241 => Enemy, 0.7289429408250698 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(2) {0.5025040680322241 => Enemy, 0.31514175919106435 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}
test.js:12 Map(1) {0.5025040680322241 => Enemy}

  ask by simon translate from so

Answer 1

didn't realize I was instatiating the objects at different positions.

(没意识到我是在不同位置使物体静止。)

oops!

(哎呀！)

:(

(:()

it is working as intended if creating objects at same positions and updating accordingly.

(如果在相同位置创建对象并进行相应更新，则它按预期工作。)