정적 함수의 해시 반환 빈 개체입니다.

Question

키를 기반으로 동적으로 그리기 함수를 호출하려고합니다.

renderFunctions를 로그 아웃하면 빈 Object {}로 표시됩니다.

'ship'과 'ball'키가있는 내부 기능이 필요합니다.

class Render { 
 
     static renderFunctions() { 
 
     return { 
 
      'ship': this.drawShip, 
 
      'ball': this.drawBall 
 
     }; 
 
     } 
 

 
     static render(key, ls, context, portal) { 
 
     let renderFns = this.renderFunctions(); 
 
     console.log(renderFns); 
 
     } 
 

 
     static drawShip(ctx, p, t) { 
 
     p.drawRect(ctx, t.x - 5, t.y - 100, 10, 100, t.teamColor); 
 
     } 
 

 
     static drawBall(ctx, p, t) { 
 
     ctx.arc(t.x, t.y, 7, 0, 2 * Math.PI, false); 
 
     ctx.fillStyle = t.teamColor; 
 
     ctx.fill(); 
 
     } 
 
    }

왜 내 기능이 표시되지 않는?

Answer 1

정적 함수를 this의 속성으로 사용하지 말고 클래스의 속성 (예 : Render)으로 참조하면 안됩니다.

class Render { 
    static renderFunctions() { 
     return {'ship' : Render.drawShip, 
     'ball' : Render.drawBall}; 
    } 

    static render(key, ls, context, portal) { 
     let renderFns = Render.renderFunctions(); 
     console.log(renderFns); 
    } 

    static drawShip(ctx, p, t) { 
     p.drawRect(ctx, t.x - 5, t.y - 100, 10, 100, t.teamColor); 
    } 

    static drawBall(ctx, p, t) { 
     ctx.arc(t.x, t.y, 7, 0, 2 * Math.PI, false); 
     ctx.fillStyle = t.teamColor; 
     ctx.fill(); 
    } 
}