슈팅게임 JetBoy #2

[준비과정]

• http://ryulib.tistory.com/328 를 먼저 보시고 오세요

[소스 1]

Ship.Visible = true;
Ship.Left = 0;
Ship.Top  = 0;
Ship.Start();

var repeaterForShip = createRepeater( 5000 );

repeaterForShip.OnInterval = on_RepeatForShip;
    
function on_RepeatForShip() {
  if (Keyboard.IsUp)   Ship.Top = Ship.Top - 1;
  if (Keyboard.IsDown) Ship.Top = Ship.Top + 1;

  if (Ship.Top < 0) Ship.Top = 0;
  if (Ship.Bottom > Screen.Bottom) Ship.Bottom = Screen.Bottom;
}    

var repeaterForMissile = createRepeater( 2000 );

repeaterForMissile.OnInterval = on_RepeatForMissile;
    
function on_RepeatForMissile() {
}

function loop() {

}

[Run 버턴을 클릭합니다]

[설명]

18-23: 라인을 보시면, 우주선의 경우와 마찬가지로 미사일을 일정한 시간마다 동작 시키기 위해서 Repeater를 생성하고 OnInterval 함수를 연결해 주고 있습니다.  아직은 on_RepeatForMissile 함수 안에 아무것도 없기 때문에 어떤 변화도 없습니다.  

18: 라인에 보시면 createRepeater 함수의 괄호 안에 2000 이 지정되어 있습니다.  우주선보다 작은 시간 마다 반복 될 것이기 때문에 미사일 처리 속도는 우주선의 처리보다 빠를 것 입니다.

[소스 2]

Ship.Visible = true;
Ship.Left = 0;
Ship.Top  = 0;
Ship.Start();

var repeaterForShip = createRepeater( 5000 );

repeaterForShip.OnInterval = on_RepeatForShip;
    
function on_RepeatForShip() {
  if (Keyboard.IsUp)   Ship.Top = Ship.Top - 1;
  if (Keyboard.IsDown) Ship.Top = Ship.Top + 1;

  if (Ship.Top < 0) Ship.Top = 0;
  if (Ship.Bottom > Screen.Bottom) Ship.Bottom = Screen.Bottom;
}    

var repeaterForMissile = createRepeater( 2000 );

repeaterForMissile.OnInterval = on_RepeatForMissile;
    
function on_RepeatForMissile() {
  if (Keyboard.IsFire && Ship.Visible) {
    Missile.Left = Ship.Right;
    Missile.CenterY  = Ship.CenterY;
    Missile.Visible = true;

    soundFire();
  }
}

function loop() {

}

[Run 버턴을 클릭합니다]

• 키보드의 스페이스 바를 클릭 해보세요.

[설명]

23-29: 라인이 추가 된 코드 입니다.

23: 라인에서 또 if 문이 나왔습니다.  그런데 이번에는 &&가 새로 나타났습니다.  &&는 "and"를 의미합니다.  결과적으로 (Keyboard.IsFire && Ship.Visible)는 Keyboard.IsFire가 진실(true)이면서 Ship.Visible이 동시에 진실이어야 결과적으로 진실이 됩니다.  즉, 두 조건이 모두 진실이어야지만 다음 문장이 실행된다는 의미입니다.  그런데, 다음 문장으로 브레이스가 보입니다.  브레이스가 시작되면 다시 끝이 나타 날 때까지 한 거번에 실행 됩니다.  결국, 괄호 안의 진실인 경우 브레이스 시작과 끝인 24-28: 라인 모두가 실행됩니다.

24: 라인에서는 미사일의 왼쪽 위치를 우주선의 오른쪽에 맞춰서 움직이고 있습니다.

25: 라인에서는 미사일의 Y 축의 가운데를 우주선의 Y 축 가운데에 맞춰서 움직이고 있습니다.

이제 미사일은 우주선 오른쪽 그리고 가운데에 위치하게 됩니다.  하지만, 아직 화면에 보이지는 않습니다.

26: 라인 에서는 미사일의 Visible 속성을 true로 바꿔서 화면에 보이도록 합니다.

28: 라인에서의 soundFire 함수는 미사일이 발사되는 소리를 냅니다.  soundFire 함수는 JetBoy 프로젝트에만 내장 된 함수 입니다.  다른 곳에서는 사용 할 수가 없습니다.

키보드의 스페이스 바를 클릭하시면, Keyboard.IsFire가 true가 됩니다.  그런데, 미사일이 나타나기만 할 뿐 앞으로 나아가지 않습니다.  이제 미사일이 앞으로 나아가도록 코드를 추가해 보겠습니다.

[소스 3]

Ship.Visible = true;
Ship.Left = 0;
Ship.Top  = 0;
Ship.Start();

var repeaterForShip = createRepeater( 5000 );

repeaterForShip.OnInterval = on_RepeatForShip;
    
function on_RepeatForShip() {
  if (Keyboard.IsUp)   Ship.Top = Ship.Top - 1;
  if (Keyboard.IsDown) Ship.Top = Ship.Top + 1;

  if (Ship.Top < 0) Ship.Top = 0;
  if (Ship.Bottom > Screen.Bottom) Ship.Bottom = Screen.Bottom;
}    

var repeaterForMissile = createRepeater( 2000 );

repeaterForMissile.OnInterval = on_RepeatForMissile;
    
function on_RepeatForMissile() {
  if (Missile.Visible) {
    Missile.Left = Missile.Left + 1;
    
    if (Missile.IsOutOfScreen) Missile.Visible = false;
    
    return;
  }

  if (Keyboard.IsFire && Ship.Visible) {
    Missile.Left = Ship.Right;
    Missile.CenterY  = Ship.CenterY;
    Missile.Visible = true;

    soundFire();
  }
}

function loop() {

}

[Run 버턴을 클릭합니다]

• 키보드의 스페이스 바를 클릭 해보세요.

[설명]

추가 된 코드를 살펴 보겠습니다.

23: 라인에 보시면 미사일의 Visible 속성이 true 일 때, 다음 명령어인 브레이스가 실행됩니다.  이미 말씀 드린 것처럼 브레이스가 시작되면 29: 라인에 있는 브레이스까지 한 번에 실행이 됩니다.

24: 라인에서는 미사일의 Left 속성을 한 칸 씩 앞으로 전진 시키고 있습니다.

26: 미사일이 화면 밖으로 나가면 Missile.Visible = false; 가 실행 됩니다.  이로써 23: 라인은 앞으로 더 이상 실행되지 않을 것 입니다.

28: 라인에서는 처음 보는 return 나타났습니다.  return이 나타나면, 함수 밖으로 나가게 됩니다.  즉, 함수의 나머지 부분은 실행되지 않습니다.

미사일이 화면에 보이는 경우에는 23: 라인의 조건이 맞아서 24-28: 라인이 실행됩니다.  그러나, 28: 라인이 실행되면 바로 함수가 끝나기 때문에 31-37: 라인은 실행되지 않습니다.

하지만, 미사일이 보이지 않는 경우에는 31-37: 라인만 실행 될 것 입니다.

[마무리]

이로써 미사일 발사 처리까지 완료하였습니다.  새로 나타난 문법들에 유의해서 스스로 코드를 작성해 보시면서 익혀보시기 바랍니다.