別のクラスの配列に格納されているクラスインスタンスを参照する

Question

タイトルが意味をなさない場合はお詫び申し上げます。私は自分自身をかなり混乱させてしまいましたが、私は以下の問題について詳述しようとします。

私は3つのJavascriptのクラスがあります。

A JS（クラスマップが含まれています） B JS（クラスmapObjectが含まれています） CのJS（マップメーカのためのロジック）

クラスのCIには、マップのインスタンスを作成しますこれはグリッドレイアウトのキャンバスです。

ユーザーはマップをクリックし、ホットキーを使用してmapObjectのインスタンスを追加できます。

は、今私はmapObjectアイコンを表示しようとするとどのようにと完全に混乱していますよ：

地図作成& MapObject作成コード（CのJS）：MapObjectで

case 13: // Enter Key (Submit) 
     unhighlightTools(); 
     currentMap.drawMap(); 
     if(currentFloor != null){ 
      currentFloor.hasFloor = true; 
      if(currentFloor.tileName == "Guild"){ 
       createGuildObject(currentFloor.position.x,currentFloor.position.y,currentFloor); 
      } 
      console.log("Map object created at - X:"+currentFloor.position.x+" Y:"+currentFloor.position.y); 
      createMapObject(currentFloor.position.x,currentFloor.position.y,currentFloor); 
     } 
     currentFloor = null; 
     highlightTools(); 
     break; 
} 

// Create a Map Object and push it to the currentMap with its position. 
function createMapObject(x,y,floor){ 
currentMap.objects.push(new MapObject(x,y,floor)); 
} 

// Create a Guild Object (extension of Map Object) and push it to the currentMap with its position. 
function createGuildObject(x,y,floor){ 
currentMap.objects.push(new Guild(x,y,floor)); 
} 

の定義地図アイコン（ b js）

class MapObject { 
constructor(x,y,floor) { 
    this.position = {x, y}; 
    this.icon = this.wallFloorIcons(floor); 
} 

wallFloorIcons(floor) { 
    var self = this; 
    self.img = new Image(); 

    self.name = <code that creates the name> 
    self.name = 'wall-'+self.name+'.png'; 

    if(self.name == 'wall-.png'){ 
     self.img.src = "../images/mapSprites/floor.png"; 
    }else { 
     self.img.src = "../images/mapSprites/"+self.name; 
    } 

    console.log(self.img); 
    return self.img; 
} 

ここで私は混乱しているビットです。 MapクラスにMapObjectからアイコンを使用して（JS）：

objectsAtPosition(position) { 
    var objs = []; 
    for (var o of this.objects) { 
     if (o.position.x == position.x && o.position.y == position.y) { 
      objs.push(o); 
     } 
    } 
    return objs; 
} 

：a.jsでこのコードを使用して、私の位置に任意のオブジェクトがある場合、私はチェックしていますif文最終的には

fillMap(){ 
    var self = this; 

    self.c.lineWidth = 1; 
    self.c.strokeStyle = 'black'; 
    self.c.fillStyle = "rgba(255, 255, 255, 0.2)"; 

    for (var row = 0; row < self.boxes; row++) { 
     for (var column = 0; column < self.boxes; column++) { 
      var x = column * self.boxSize; 
      var y = row * self.boxSize; 

      self.c.beginPath(); 
      self.c.rect(x, y, self.boxSize, self.boxSize); 
      self.c.stroke(); 
      self.c.closePath(); 

      for (var i=0; i<self.objects.length; i++) { 
       var floor = self.objects[i]; 
       if (floor.position.x == column && floor.position.y == row) { 
        if (self.objectsAtPosition({x:floor.position.x, y:floor.position.y}) != null) { 
         var j = self.objectsAtPosition({x:floor.position.x, y:floor.position.y}); 
         console.log(j.icon); 
         this.c.drawImage(self.objectsAtPosition({x:floor.position.x, y:floor.position.y}).getIcon(),x,y, self.boxSize, self.boxSize); 
        } 
       }  
      } 
     } 
    } 

要約...

私はあるクラスのインスタンスを作成して、別のクラスの配列にプッシュします。その後、アイコンを第1クラスのインスタンスから第2クラスのインスタンスに取得しようとしている。

私のconsole.log（j.icon）は未定義を返しますが、私はMapObjectから詳細を取得できないようですが、console.log（j）の場合はコンソールにMapObjectが表示されますすべての細部と一緒に。

私はこれではまだ新しいですし、私はそれの右の混乱を作ってるんだと確信しているので、私に簡単にアクセスしてください：P

感謝を！ Lemongrab

Answer 1

objectsAtPosition()はオブジェクトの配列を返しており、配列にはiconというプロパティがありません。たぶん、あなたはself.objectsAtPosition({x:floor.position.x, y:floor.position.y})を反復処理したい：

const mapObjects = self.objectsAtPosition({x:floor.position.x, y:floor.position.y}) 
for (const mapObject of mapObjects) { 
    this.c.drawImage(mapObject.getIcon(), x, y, self.boxSize, self.boxSize); 
} 

いくつかの他の提案：あなただけfloor.positionを使用することができます

1. 代わりの{x:floor.position.x, y:floor.position.y}。
2. objectsAtPosition()はArray.filter()で、より簡単に書くことができます。return this.objects.filter(o => o.position.x == position.x && o.position.y == position.y)
3. あなたのメソッド内で匿名関数の内部でthisの値にアクセスできるようにしたい場合を除きvar self = thisを行う必要はありません。