JS - 사용자 지정 개체의 반환 값을 사용할 수 없습니다.

Question

좋은 하루, 내 코드에서 문제가있는 것 같습니다. 내가 모르는 뭔가가 있어야하지만 난 그냥 ... 사용자 정의 개체가

내가 추가하고`keysDown 배열 '에서 키를 제거 처음이 이벤트 리스너에서이 을 ... 그것을 찾을 수 없습니다 :

그런 다음

function Vector(x,y) { 
    this.x = x; 
    this.y = y; 
    this.translate = function(x,y){ 
     this.x += x; 
     this.y += y; 
    }; 
} 

나는 새로운 벡터 객체를 반환하는 사용자 정의 기능이 : 나는 초당 60 회 간격으로 실행되는 반복 기능을 가지고 다음

function Input() { 
    var v = new Vector(0,0); 
    if(keysDown["w".toCharCode(0)]) { 
     v.y = 1; 
    } else if (keysDown["s".toCharCode(0)]) { 
     v.y = -1; 
    } 
    return v; 
} 

을,이 안에 내를 번역 할 받은 입력을 사용하는 벡터 :

var charPosition = new Vector(5,5); 

setInterval(function(){ 

    var input = Input(); 
    charPosition.translate(input.x, input.y); 

},(1000/60)); 

내가 간격 함수 내에서 별도의 var inputX, var inputY에 처리하고있을 때 입력이 완벽하게 작동합니다. 그러나 그것을 추출하고 리턴 타입을 생성하자마자, 나는 이런 방식으로 결과를 얻지 못한다. I는 함수 입력() 비트를 변경하여 문제를 해결 같은

<script> 
    addEventListener("keydown", function(e){ 
     keysDown[e.keyCode] = true; 
    },false); 
    addEventListener("keyup", function(e){ 
     delete keysDown[e.keyCode]; 
    },false); 

    var canvasWidth = 640; 
    var canvasHeight = 480; 

    var canvas = document.getElementById("canvas"); 

    var keysDown = {}; 
    var oldKeysDown = {}; 

    function Vector(x,y){ 
     this.x = x; 
     this.y = y; 

     this.lerp = function(startVector,endVector,percent){ 
      var v = new Vector(); 
      v.x = startVector.x + percent * (endVector.x - startVector.x); 
      v.y = startVector.y + percent * (endVector.y - startVector.y); 
      return v; 
     }; 

     this.translate = function(x,y){ 
      this.x += x; 
      this.y += y; 
     }; 

     this.toString = function(){ 
      return "("+this.x+":"+this.y+")"; 
     }; 

     this.set = function(x,y){ 
      this.x = x; 
      this.y = y; 
     }; 

    } 

    function Entity(){ 
     // Instantiate entity variables 
     this.position = new Vector(); 
     this.sprite = new Image(); 
     this.velocity = new Vector(); 
     this.entityID = ""; 
     this.entity = ""; 

     // Entity update function 
     // This is where code-side movement and collision detection should be done. 
     this.update = function(){ 
      this.position.translate(this.velocity.x,this.velocity.y); 

      // Detect screen-edge 
      if(this.position.x - this.sprite.width/2 < 0) 
      { 
       this.position.x = 0+(this.sprite.width/2); 
      } 
      if(this.position.x + this.sprite.width/2 > canvasWidth) 
      { 
       this.position.x = canvasWidth-(this.sprite.width/2); 
      } 
      if(this.position.y - this.sprite.height/2 < 0) 
      { 
       this.position.y = 0+(this.sprite.height/2); 
      } 
      if(this.position.y + this.sprite.height/2 > canvasHeight) 
      { 
       this.position.y = canvasHeight-(this.sprite.height/2); 
      } 
     }; 

     this.init = function(elementID) 
     { 
      this.elementID = elementID; 
      this.entity = document.getElementById(this.elementID); 
      this.position.x = canvasWidth/2-(char.sprite.width/2); 
      this.position.y = canvasHeight/2-(char.sprite.height/2); 
      this.entity.style.left = (this.position.x - this.sprite.width/2) + "px"; 
      this.entity.style.bottom = (this.position.y - this.sprite.height/2)+ "px"; 
      this.entity.innerHTML = "<img src='" + this.sprite.src + "' alt='0'>"; 
     }; 

     // Entity draw method - This ensures that the object on the webpage is updated to the same as the code-values; 
     this.draw = function(){ 
      this.entity.style.left = (this.position.x - this.sprite.width/2) + "px"; 
      this.entity.style.bottom = (this.position.y - this.sprite.height/2)+ "px"; 
     }; 
    } 

    function Input(){ 
     var v = new Vector(0,0); 
     if(keysDown['W'.charCodeAt(0)]){ 
      v.y = 1; 
     }else if (keysDown['S'.charCodeAt(0)]){ 
      v.y = -1; 
     } 

     if(keysDown['D'.charCodeAt(0)]){ 
      v.x = 1; 
     }else if (keysDown['A'.charCodeAt(0)]){ 
      v.x = -1; 
     } 

     return v; 
    } 

    // Initializing a new character 
    var char = new Entity(); 
    char.sprite.src = "spr_character.png"; 
    char.init("character"); 

    // This is where the magic happen, this is set to try and run at 60 frames per second (1000ms/60frames) 
    setInterval(function(){ 
     var inp = Input(); 

     // Doing console.log(inp.toString()) returns the correct input 

     char.position.translate(inp.x,inp.y); 

     char.update(); 
     char.draw(); 

    },(1000/60)); 

    </script> 

Answer 1

같다 :

여기서 스크립트의 전체 소스이다.

function Input(){ 
    var v = new Vector(0,0); 
    if(keysDown['W'.charCodeAt(0)]){ 
     v.y = 1; 
    }else if (keysDown['S'.charCodeAt(0)]){ 
     v.y = -1; 
    } 

    if(keysDown['D'.charCodeAt(0)]){ 
     v.x = 1; 
    }else if (keysDown['A'.charCodeAt(0)]){ 
     v.x = -1; 
    } 

    return v; 
} 

사람 : 보낸 사람 :

function Input(){ 
    this.v = new Vector(0,0); 
    if(keysDown['W'.charCodeAt(0)]){ 
     this.v.y = 1; 
    }else if (keysDown['S'.charCodeAt(0)]){ 
     this.v.y = -1; 
    } 

    if(keysDown['D'.charCodeAt(0)]){ 
     this.v.x = 1; 
    }else if (keysDown['A'.charCodeAt(0)]){ 
     this.v.x = -1; 
    } 

    return this.v; 
} 

나는 this.v를 사용하는 대신 var v 일을 변경하여 가정?

비록 내가 출력을 잘 읽을 수 있지만, 첫 번째 코드에서는 사용할 수 없다는 것이 귀찮습니다.

그러나 그것은 다른 날을위한 것입니다. 지금은 해결되었습니다!

귀하의 의견에 감사드립니다 .-D :-D