如何用 JavaScript 做个 RPG 游戏?

如何用 JavaScript 做个 RPG 游戏?
0

你是否想过自己做一个游戏?你是不是觉得自己没这个本事?别担心,我当时也是这样想的!

例如,我就特别害怕使用对象。我曾经觉得它们实在难以理解,但是如今我已经熟练使用它了。我用JavaScript做了一个RPG游戏,现在我就来讲一讲这个过程。

如果你感兴趣的话,可以在这里试玩这个游戏(请注意这个游戏尚未针对移动设备进行优化)。

首先,你需要确定游戏的类别

迷宫游戏?RPG游戏?战斗游戏?然后想一想,在制作这个游戏的过程中,你将会遇到哪些技术难题?例如迷宫游戏,就会需要你使用很多复杂的JavaScript代码。而战斗游戏需要你在多种代码中做好平衡。

另外,你还需要决定游戏在哪个平台上运行:浏览器中?移动设备上?还是两者都有(native web游戏)?

例如,我的游戏就无法良好的运行在智能手机上,因为主界面上有很多的小格子,在手机上这些格子会变得太小,无法点击。

第二,写下所有你需要编写的东西。

用我的游戏来举例,我需要的东西有:

  • 道具库系统
  • 物品生成器
  • 人物状态系统
  • 储存系统

第三,开始制作游戏,依次解决你写下的问题。

把整个游戏拆分成若干个小任务,会让开发过程更加轻松。

如果你手绘能力不太强,你可以使用下面这些工具来创建各种让游戏看上去更漂亮的东西:

  • Game-Icons.net
  • Open Game Art
  • Bulk Resize Photos
  • CSS Sprite Generator

我遇到的问题及解决办法

1.Spritesheets

你的游戏中是否使用了大量的图像?如果是的话,给每个图像都添加链接,这不是一个聪明的做法。

在这样的情况下,Spritesheets就显得非常方便了。你只需要在它上面放一些图片,把CSS文件拷贝至你的项目,然后给元素添加与目标图像相应的类就可以了。

2.保存游戏的状态

你希望游戏被储存吗?你有两种方式进行储存:使用浏览器的LocalStorage,或是在服务器上进行储存。

使用服务器储存需要你掌握后端知识。如果你对后端没有了解,我建议你使用LocalStorage。只要用户不适用清理工具删除数据,游戏就可以储存。我使用这种方式来实现的:

3.代码模块化

搞清楚哪部分代码需要硬编码(hard-code),哪部分代码可以模块化。我刚刚开始的时候,错误的采取了永远硬编码的方式,很快我就看到了弊端。我需要24个函数,与其对应的还有24个ifCritical函数。

image

你现在可能会问:第二个spell是如何工作的?这里有一个playerAttack()函数,它可以使用spell对象来完成下述工作:

它首先会更新spells调用spell对象的spell函数。然后spell将你带到当前的stats,再将他们转换为damage和mana cost等值。

它会检查damage是否大于0。如果大于0,它会对游戏中的boss造成伤害,并且显示伤害值。对于其他值,它也会做出相似的处理。

之后它会运行一个自定义函数,如果spell有这个函数的话。它可以用来给spell攻击添加特殊效果,这个效果是普通攻击函数所没有的。

4.游戏循环

对我来说,游戏的循环会检查并更新这些内容:角色状态、角色是否已经死亡、角色是否升级、boss是否死亡等。

这些都需要你自己进行配置。我觉得这是一个不错的学习过程。你要考虑何时需要进行检查和更新。例如,我将升级检查设定为每20秒一次。

另外,在战斗开始以后,我会让游戏每秒检查一次boss是否已经死亡,因为玩家肯定不想等20秒之后才知道自己已经战胜了boss。

Bug和漏洞

不断出现的bug和漏洞让我感到有点害怕。我仔细做出的游戏居然存在bug,让我有点难以相信。

我可能说得有点邪乎,但是我确实一度忽视了bug的威力。

以下就是我遇到的一些主要的bug和漏洞:

  • 在对抗boss的时候,你可以更改boss的级别,以此让boss掉下更多的装备

  • 生命值和魔法值的边框有时会重叠

  • 在战斗开始之前,你就可以攻击boss

  • 魔法值会变成复数,让你连最基本的魔法都无法使用

  • 治疗的时候会暂时提高你的最大生命值

  • 由于CSS问题,有一个装备框无法点击

这些都是严重的问题,作为一款MMORPG游戏,这些问题会毁了整个游戏。不过好消息是,这些问题都很好修复——通常修复他们只需要一行代码。

不过还有一些bug,修复起来就比较困难了,需要你对整个系统进行重新调整。例如spell系统,我要给每个spell添加3个新的函数,才能解决一个很小的问题。

请记住,我只是一个编程新手,接触编程只有2个月的时间,因此我的很多解决方式其实并不是最好的。我希望通过我的经历,能够让你树立起足够的信心。

你也去用Javascript做一个小游戏吧,祝你编程愉快哦!

2赞