掌握聚合最新动态了解行业最新趋势
API接口,开发服务,免费咨询服务

如何用JavaScript做了个RPG游戏?

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

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

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

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

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

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

第二,写下所有你需要编写的东西。用我的游戏来举例,我需要的东西有:

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

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


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

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

我遇到的问题及解决办法


Spritesheets


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

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

保存游戏的状态


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

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


代码模块化


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



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

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

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

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

游戏循环


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

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

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

Bug和漏洞



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

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

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

  • 在对抗boss的时候,你可以更改boss的级别,以此让boss掉下更多的装备
  • 生命值和魔法值的边框有时会重叠
  • 在战斗开始之前,你就可以攻击boss
  • 魔法值会变成复数,让你连最基本的魔法都无法使用
  • 治疗的时候会暂时提高你的最大生命值
  • 由于CSS问题,有一个装备框无法点击

这些都是严重的问题,作为一款MMORPG游戏,这些问题会毁了整个游戏。

不过好消息是,这些问题都很好修复——通常修复他们只需要一行代码。

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

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

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

原文来自:SDK.cn

声明:所有来源为“聚合数据”的内容信息,未经本网许可,不得转载!如对内容有异议或投诉,请与我们联系。邮箱:marketing@think-land.com

  • 营运车判定查询

    输入车牌号码或车架号,判定是否属于营运车辆。

    输入车牌号码或车架号,判定是否属于营运车辆。

  • 名下车辆数量查询

    根据身份证号码/统一社会信用代码查询名下车辆数量。

    根据身份证号码/统一社会信用代码查询名下车辆数量。

  • 车辆理赔情况查询

    根据身份证号码/社会统一信用代码/车架号/车牌号,查询车辆是否有理赔情况。

    根据身份证号码/社会统一信用代码/车架号/车牌号,查询车辆是否有理赔情况。

  • 车辆过户次数查询

    根据身份证号码/社会统一信用代码/车牌号/车架号,查询车辆的过户次数信息。

    根据身份证号码/社会统一信用代码/车牌号/车架号,查询车辆的过户次数信息。

  • 风险人员分值

    根据姓名和身份证查询风险人员分值。

    根据姓名和身份证查询风险人员分值。

0512-88869195
数 据 驱 动 未 来
Data Drives The Future