자바 스크립트에서 텍스처 타일을로드하고 나중에 참조하는 가장 효율적인 방법은 무엇입니까?

Question

최근에 나는 자바 스크립트에서 pixi.js와 객체 지향을 배우는 방법으로 간단한 platformer 게임을 만들기 시작했습니다. 현재, 레벨을 텍스트 파일에 다음과 같이 저장하고 있습니다.

11111111111 
10001200001 
10601201001 
10104001551 
13331111111 

각 숫자는 다른 타일에 해당합니다.

각각의 타일은 고유하고 종종 고유 한 속성을 가지고 있기 때문에 타일을 만들고 참조하는 작업을 가능한 간단하고 쉽게 할 수 있도록 어떻게 코드를 구성 할 수 있습니까? 각 타일마다 고유 한 생성자가 있어야합니까? 아니면 많은 매개 변수를 필요로하는 하나만 생성해야합니까? 렌더링 된 각 블록이 자체 객체인지 또는 각 타일을 참조하는 더 간단한 방법이 있습니까?

자세한 정보를 제공해야하는 경우 알려주세요. 감사!

Answer 1

btw 레벨에 ASCII 문자를 사용하면 읽기가 더 쉽습니다.

개인적으로 나는 모든 타일마다 다른 클래스를 사용합니다. 그러나 SUPER과 비슷한 타일을 만들면 두 가지와 비슷한 클래스를 만들면 비슷한 타일을 만들 수 있습니다. 클래스 확장. 예를 들어 Enemy 클래스에는 적 유형 인 여러 하위 클래스가 있습니다. 나는 서브 클래스가 이라 불리는 Basic을 기본 적으로하지만, 서브 클래스는 Machine_Gun으로 더 빨리 쏘아 올렸다.

그냥 스위치 케이스 사용, 레벨 데이터를 읽으려면 : 다음

for(var y = 0; y < levels[level_number]; y++) { 

    for(var x = 0; x < levels[level_number][y]; x++) { 

     switch(levels[level_number][y][x]) { 

      case "#": floor.push(new Floor(x * 20, y * 20)); break; 

      case "O": coins.push(new Coin(x * 20, y * 20)); break; 

      case "@": player.y = (x * 20) - 1; player.x = (y * 20) - 1; break; 

      case "&": monsters.push(new Basic(x * 20, y * 20)); break; 

      case "%": monsters.push(new Machine_Gun(x * 20, y * 20)); break; 

      default: break; // something else like air. 

     } 

    } 

} 

을, 내 수준은 다음과 같이 할 수있다 :

그냥 그렇게

levels = [ 

    [ 

     "##########", // MUCH easier to understand (for me at least) 
     "#OO  %#", 
     "###  ##", 
     "# @  &#", 
     "##########" 

    ], [ 

     "###############", 
     "#   & #", 
     "#   ####", 
     "#    #", 
     "#  ###  #", 
     "#   O #", 
     "# @  ####", 
     "####   #", 
     "#O  % % #", 
     "###############" 

    ] 

]; 

, 쉽게 만들 수 있습니다 수준.