2016-10-02 7 views
0

私はおそらくいくつかの概念を誤解していましたが、stackoverflowで4つのトピックを読んだ後、 "typescriptでプライベートメンバー"のドキュメントを読んだ後も - 私はまだ混乱しています。Typescriptプライベートメソッドは "関数ではありません"

私は単純なマウスIO(最初のスクリプトスクリプト)を書いています。これは、誤動作マウスクラスの完全なコードです:

class Mouse { 
    public left: MouseKeyData = new MouseKeyData(); 
    public right: MouseKeyData = new MouseKeyData(); 
    public whell: MouseKeyData = new MouseKeyData(); 

    public x: number = 0; 
    public y: number = 0; 

    private crossBrowserButton(e: any):string { 
     switch (e.button) { 
      case 0: return 'left'; 
      case 1: return 'whell'; 
      case 2: return 'right'; 
      case 3: return 'back'; 
      case 4: return 'forward'; 
     } 
     return 'none'; 
    } 


    private onMouseDown(e: any):void { 
     let target: MouseKeyData = this.left; 
     try {console.log(this.crossBrowserButton(e))} catch (a) {console.warn(a)} finally {} 
     if(target) { 
      target.press(); 
     } 
    } 

    private onMouseUp(e: any):void { 
     let target: MouseKeyData = this.left; 
     if(target) { 
      target.release(); 
     } 
    } 

    private onMouseMove(e: any): void { 
     this.x = e.pageX; 
     this.y = e.pageY; 
    } 

    public constructor() { 
     let anchor = document.body; 

     anchor.addEventListener('mousedown', this.onMouseDown); 
     anchor.addEventListener('mouseup', this.onMouseUp); 
     anchor.addEventListener('mousemove', this.onMouseMove); 

    } 
} 

私はonMouseDownonMouseUpthis.crossBrowserButton(e)を呼び出すために使用されるが、私は唯一のthis.crossBrowserButton is not a function(…)を得ました。

私はthisスコープをいくつか失ったと思いますが、this.leftは完全に機能します。

ありがとうございます!

+0

私は、このエラーが低技能の世界では一般的で、何が間違っているかを把握しているので、この質問を閉じるよう投票しました。 –

答えて

1

あなたがしていたはずのものとまったく同じように聞こえます。元のコードでは、イベントリスナーの実行範囲に問題があります。クラスのスコープにバインドされていないため、実行されるコンテキストで実行されます。

イベントバインディングは次のようになります。

anchor.addEventListener('mousedown', this.onMouseDown.bind(this)); 
    anchor.addEventListener('mouseup', this.onMouseUp.bind(this)); 
    anchor.addEventListener('mousemove', this.onMouseMove.bind(this)); 
0

さて、私はそれを理解しました:イベントでdocument.bodyにthisをバインドしてから、私はこの方法を取ったthisです。

レビューありがとうございます。おやすみなさい!

関連する問題