javascript (2)_javascript 기술로 탱크 전투 전체 기록 만들기-JS 튜토리얼-php.cn

javascript (2)_javascript 기술로 탱크 전투 전체 기록 만들기

WBOY

풀어 주다： 2016-05-16 16:30:04

원래의

1465명이 탐색했습니다.

2. 지도를 개선하세요

우리 지도에는 열린 공간, 벽, 강철, 잔디, 물, 본부와 같은 장애물이 있습니다. 우리는 이 모든 것을 객체로 디자인할 수 있습니다.

2.1 장애물 개체 그룹 생성

개체 그룹은 개체의 속성을 사용하여 개체가 통과할 수 있는지 또는 공격할 수 있는지를 결정합니다.

Barrier.js:

코드 복사 코드는 다음과 같습니다.

// TankObject
에서 상속된 장애물 기본 클래스 객체
장벽 = 함수() {

This.DefenVal = 1; // 방어력

This.CanBeAttacked = true; // 공격 가능 여부

}

Barrier.prototype = new TankObject();

// 벽

WallB = 함수 () { }

WallB.prototype = new Barrier();

// 열린 공간 

비어있음B = 함수 () {

This.CanAcross = true; // 통과 가능

}

EmptyB.prototype = new Barrier();

// 강

RiverB = 함수() {

This.DefenVal = 0;

This.CanBeAttacked = false; // 객체의 멤버를 먼저 가져오고 상위 클래스에서 상속된 멤버를 덮어씁니다. 

}

RiverB.prototype = new Barrier();

// 강철

SteelB = 함수 () {

This.DefenVal = 3;

}

SteelB.prototype = new Barrier();

// 잔디 개체

TodB = 함수 () {

This.CanBeAttacked = false;

This.DefenVal = 0;

This.CanAcross = true;

}

TodB.prototype = 새로운 장벽();

//본사

PodiumB = 함수() {

This.DefenVal = 5;

}

PodiumB.prototype = new Barrier();

2.2 지도에 데이터가 기록됩니다.

Common.js에 다음 코드를 추가하세요.

코드 복사 코드는 다음과 같습니다.

//맵 요소 유형 열거

/*

0: 열린 공간 

1: 벽 

2: 강철 

3: 덤불 

4：강 

5: 본사 

*/

var EnumMapCellType = {

비어 있음: "0"

, 벽: "1"

, 강철: "2"

, 토드: "3"

, 강: "4"

, 연단: "5"

};

//각 지형에 해당하는 스타일 이름

var ArrayCss = ['빈', '벽', '강철', '토드', '강', '연단'];

// 레벨 맵

/*레벨*/

var str = '0000000000000';

str = ',0011100111010';

str = ',1000010000200';

str = ',1200333310101';

str = ',0000444400001';

str = ',3313300001011';

str = ',3011331022011';

str = ',3311031011011';

str = ',0101011102010';

str = ',0101011010010';

str = ',0100000000110';

str = ',0100012101101';

str = ',0010015100000';

//스토리지 레벨 맵 0,1,2,3...은 각각 1-n입니다...레벨

var Top_MapLevel = [str];

2.3 지도 그리기

이제 준비가 끝났으니, 음식을 서빙하고 지도를 그려봅시다. 앞서 언급했듯이 우리 맵은 13 * 13 테이블입니다. 그래서 게임 로딩 객체에 행과 열 속성을 추가하고 초기화 맵 메소드를 추가합니다.

Frame.js:

코드 복사 코드는 다음과 같습니다.

// 게임 로딩 객체 전체 게임의 핵심 객체 

GameLoader = 함수 () {

This._mapContainer = document.getElementById("divMap"); // 게임 맵을 저장하는 div

This._selfTank = null; // 플레이어 탱크

This._gameListener = null; // 게임 메인 루프 타이머 ID

/*v2.0에 새로운 속성이 추가되었습니다*/

This._level = 1;

This._rowCount = 13;

This._colCount = 13;

This._battleField = []; // 지도 객체의 2차원 배열을 저장합니다

}

//지도 메소드 로드

로드: 함수() {

                // 레벨에 따라 지도 초기화 

        var map = Top_MapLevel[this._level - 1].split(",");

        var mapBorder = UtilityClass.CreateE("div", "", "mapBorder", this._mapContainer);

// 맵 테이블의 각 셀을 탐색합니다

for (var i = 0; i < this._rowCount; i ) {

                                 // div를 생성하고 각 행의 지도가 이 div에 저장됩니다. 

            var divRow = UtilityClass.CreateE("div", "", "", mapBorder);

//1차원 배열에 또 다른 배열 생성

This._battleField[i] = [];

for (var j = 0; j < this._colCount; j ) {

// 지도 데이터 읽기, 기본값: 0

              var v = (map[i] && map[i].charAt(j)) ||
// 스팬 요소를 삽입합니다. 스팬 요소는 맵 단위입니다 

              varspanCol = UtilityClass.CreateE("span", "", "", divRow);

                    spanCol.className = ArrayCss[v];

                             // 후속 충돌 감지를 용이하게 하기 위해 지도 객체를 2차원 배열에 넣습니다. 

              var to = null;

스위치 (동사) {

사례 EnumMapCellType.Empty:

                              to = new 빈B();

휴식;

사례 EnumMapCellType.Wall:

                                to = new WallB();

휴식;

사례 EnumMapCellType.Steel:

                                 to = new SteelB();

                             휴식;

사례 EnumMapCellType.Tod:

                                to = new TodB();
                             휴식;

사례 EnumMapCellType.River:

                             to = new RiverB();

                             휴식;

사례 EnumMapCellType.Podium:

                              to = new PodiumB();

                             휴식;

~ ~                기본값:

throw new Error("지도 번호가 범위를 벗어났습니다!");

                             휴식;

                 }

                     to.UI =spanCol;

                        // 여기서 j는 X입니다. 내부 루프가 수평이므로 x는 가로좌표입니다. 

                         to.XPosition = j;

                       to.YPosition = i;

                                         // 현재 지도 객체를 2차원 배열에 저장하고 obj는 장애물 객체이고 occupier는 점유 객체입니다 

This._battleField[i][j] = { obj: to, occupier: null, lock: false };

                                          //종료

                                  // 종료

                                         // 창 전역 변수에 넣기 

            window.BattleField = this._battleField;

}