CraftyJS : 나는 craftyJS에 문제가 있어요 .onHit

Question

로 엔티티를 파괴 할 수 있습니다. 나는 레이저를 쏘는 우주선을 만들었지 만, 레이저가 그것과 충돌 할 때 엔티티를 파괴하길 바란다. 이미이 작업을 시도했지만 작동하지 않습니다. 여기 내 코드는 다음과 같습니다.

Crafty.init(1340,650, document.getElementById('game')); 
Crafty.defineScene("gameStart", function() { 
function newAlien(){ 
    var random = Math.floor(Math.random() * 4) + 1; 
    switch(random){ 
     case 1: 
      var alien = Crafty.e("2D, DOM, Image, Collision") 
       .image("alien1.png"); 
      alien.x = ship.x; 
      alien.y = 20 
      break; 
     case 2: 
      var alien = Crafty.e("2D, DOM, Image, Collision") 
       .image("alien2.png"); 
      alien.x = ship.x; 
      alien.y = 20; 
      break; 
     case 3: 
      var alien = Crafty.e("2D, DOM, Image, Collision") 
       .image("alien3.png"); 
      alien.x = ship.x; 
      alien.y = 20; 
      break; 
     case 4: 
      var alien = Crafty.e("2D, DOM, Image, Collision") 
       .image("alien4.png"); 
      alien.x = ship.x; 
      alien.y = 20; 
      break; 
     } 
} 
function newLaser(){ 
    var laser = Crafty.e("2D, DOM, Image, Collision") 
    .image("laser.png") 
    .collision() 
    .onHit("alien", function(){ 
     laser.destroy(); 
     alien.destroy(); 
    }); 
    laser.y = 510; 
    laser.x = ship.x + 40; 
    var moveLaser = setInterval(function(){ 
     if(laser.y < 1){ 
      clearInterval(moveLaser); 
      laser.destroy(); 
     } else { 
      laser.y = laser.y - 4; 
     } 
    }, 1); 
} 

function checkBorder(){ 
    if(ship.x < 0 || ship.x > 1250){ 
     Crafty.enterScene("gameStart"); 
    } 
} 
function goLeft(){ 
    var goLeftCount = 65; 
    var goLeftInterval = setInterval(function(){ 
     if(goLeftCount === 0){ 
      clearInterval(goLeftInterval); 
      checkBorder(); 
     } else { 
     ship.x = ship.x - 1; 
     goLeftCount -= 1; 
     } 
    }, 1); 
} 
function goRight(){ 
    var goRightCount = 65; 
    var goRightInterval = setInterval(function(){ 
     if(goRightCount === 0){ 
      clearInterval(goRightInterval); 
      checkBorder(); 
     } else { 
      ship.x = ship.x + 1; 
      goRightCount -= 1; 
     } 
    }, 1); 
} 
var ship = Crafty.e("2D, DOM, Image, Bind") 
    .image("ship.png") 
    .bind('KeyDown', function(e) { 
      if(e.key == Crafty.keys['LEFT_ARROW']) { 
       goLeft(); 
       } else if (e.key == Crafty.keys['RIGHT_ARROW']) { 
       goRight(); 
       } else if(e.key == Crafty.keys['SPACE']) { 
       newLaser(); 
       } 
      }); 
ship.y = 520; 
ship.x = 600; 
newAlien(); 
}); 
Crafty.enterScene("gameStart"); 

아무도 내 코드의 문제점을 말해 줄 수 있습니까?

Answer 1

하나의 문제 : 당신이 외계인을 파괴하려고하면 alien 변수가 범위에 실제로 아니다. (다른 함수로 선언했기 때문에) alien.destroy();은 작동하지 않습니다.

두 번째 문제 : 레이저는 "외국인"구성 요소를 사용하여 개체를 칠 때 당신은 .onHit("alien", callback)에 전달하는 기능 만 실행됩니다. 엔티티에 어떤 변수 이름을 할당했는지는 알 수 없습니다. 그러나 콜백 함수에는 충돌하는 엔터티에 대한 정보가 전달되며이를 사용하여 충돌을 해결할 수 있습니다.