基于JavaScript技術下的Web小游戲隨機地圖的實現

吳強

摘要：Web小游戲深受大眾所喜愛的小游戲，本文詳細的介紹在Web平臺下，使用JavaScript腳本語言實現Web小游戲中最為關鍵算法之—“隨機地圖”。

關鍵詞：Web小游戲；JavaScript；隨機地圖

隨著社會的發展，人們的生活的壓力越來越大，游戲成為了人們放松和解壓的一種方式，為了滿足人們的需要，游戲事業飛速發展，游戲開發的種類也越來越多，越來越新穎。網絡游戲深受大眾的喜愛。

JavaScrip是一款Web開發的腳本語言，常用來制作網頁的動態功能，制作Web小游戲使用JavaScrip更加機動靈活。

Web小游戲種類繁多，但是絕大多數游戲都離不開地圖，如貪吃蛇、連連看、推箱子、泡泡堂等等，每種游戲都有不同的地圖，地圖布局大至分為三類：第一類固定地圖，如推箱子，這類游戲地圖的每一關都是固定的；第二類是所有對像都是隨機的，如連連看游戲，游戲圖片要求成對出現，隨機布在二維地圖中；第三類為半隨機地圖，各關地圖都是固定的，但是每一關的果實、道具是隨機布在地圖之中的，如貪吃蛇、泡泡堂等。固定地圖的布局相對來說比較簡單，一般采用一個二維數組，數組中的數分別表示不同的對象，再跟據這個數組完成相應布局。而隨機地圖布局的方法有很多種，現在我們就探討一下。

一、分析數據二維數組取數

現在以“連連看游戲”為例，游戲首先要考慮如何制作地圖，根據游戲規則，制作地圖要解決以下幾個問題：一是地圖有多大，有多少行，有多少列；二是每張圖片允許出現多少次；三是排列的圖片應是隨機出現的，每次都不相同。

“連連看”是一個平面游戲，根據關數的不同圖片的數量上也可以有所不同，可以由5行8列的組成，也可以由7行12列的等等，跟據地圖的大小和難度的不同，同一張圖片可以出現8次也可以出現6次或4次列組成，圖片出現的次數越少，難度越大。現在我就以7行12列，每張圖片出現6次為例，7×12共有84張圖片，每張出現6次，一共有14張不同的圖片組成。

平面游戲地圖最為常見的是使用二維數組來完成，JavaScript中的數組和其他許多編程語言有所不同，JavaScript中數組的下標變量可以是任意數據類型，根據游戲要求，JavaScript可以更加方便的制作游戲地圖。制作7×12的地圖每張圖片出現6張，因此定義一個7×12的二維數組，中間取數為1至14，每個數出現6次，程序如下：

二、隨機交換數組數據：

以上二維數組的數據是有規律的，那如何將這個有規律的數組數據隨機排列呢？可以對二維數組進行遍歷，每個下標變量都和二維數組中隨機的取一個下標變量交換數據，當循環完畢后，數組也成為了一個隨機的二維數組，數據是沒有規律出現的。程序代碼如下：

3、制作圖片類：

JavaScript是一個面向對象的編程軟件，可以做一個圖片對象類，可以記錄每張游戲圖片的基本信息及當前狀態以便程序訪問。

4、根據數組數據布置地圖

首先用PhotoShop將做出14張一樣大小的圖片，如40×50像素存為jpg文件，并順序命名為pic0、pic1、pic2……pic14，將圖片存入站點中的圖片文件夾img中，利用JavaScript語言生成HTML代碼實現游戲地圖的布局，代碼如下：

隨機地圖布局的算法還有很多，使用不用的HTML標簽布局JavaScript代碼也不相同，在制作游戲的過程中只有利用每一種軟件的優勢，才能更好的制作出優秀的Web小游戲。