游戏组件的Javascript类结构

Posted

技术标签:

【中文标题】游戏组件的Javascript类结构【英文标题】:Javascript class structure for game component 【发布时间】:2015-09-03 17:36:49 【问题描述】:

我今天来到这里,对如何处理我计划编写的某个类场景有更多的设计/概念疑问。

这样吧,我要实现一个怪物类,它会保存与我游戏中存在的怪物种类相关的大部分数据,但它不会保存有效数据,实际上我想在这里存储的是可能值的范围,所以当我实际创建一个怪物对象时,它的属性将在遇到的怪物种族/种类的范围内。

举例: 我会有不同类型的怪物,老鼠,蜘蛛,蛇,狼。每个种族都会在一定范围内滚动属性:

Rat: Attack [5,9], Defense [3,5]
Spider: Attack [6,11], Defense [4,5]
...

我想将这些数据放在我的 js 文件中的 JSON 对象上,然后我会从中加载它的数据并准备在遇到时考虑到这些值来创建怪物对象。

困扰我的是我应该为实现这一目标而做出的设计。我想说引用怪物类型的一个好方法是,Monster.Rat,Monster.Spider,并在遭遇发生时调用它们的构造函数:Monster.Spider() -> 会给我一个怪物对象在蜘蛛范围内具有随机属性。

在某个时间点,我想创建特定区域来查找特定类型的怪物,但我无法清楚地看到如何以简单的方式做到这一点,而不会使代码难以阅读。

几个月前我用 Swift 做过类似的事情,我采用的方法是为我想要的每种类型的怪物都有一个关于 monster 的类方法,但这很难维护,因为如果我想改变创建怪物的方式我将不得不更改所有方法,还要为所需的每种新类型的怪物添加一个新方法。

您认为处理此类游戏设计的最佳方式是什么?我知道我不想为我拥有的每一种新型怪物创建新的类来扩展 Monster,因为这对我来说感觉非常错误和糟糕的设计。

感谢您抽出宝贵时间,我会根​​据我发现的任何有趣的信息来更新这篇文章。

【问题讨论】:

我的回答解决了你的问题吗? 【参考方案1】:

编辑:我也为您对该脚本进行了一些改进 - 只是为了强调可以做什么:

var Monster = 
    monsters: 
        rat: 
            attack: [5, 9],
            defense: [3, 5],
            health: [5, 10],
            title: "Rat"
        ,

        spider: 
            attack: [6, 11],
            defense: [4, 5],
            health: [4, 6],
            title: "Spider"
        
    ,

    create: function(type) 
        // choose type at random if not specified
        if(typeof type !== "string") 
            var keys = [ ];
            for(var key in this.monsters) 
                if(this.monsters.hasOwnProperty(key)) 
                    keys.push(key);
                
            

            type = keys[Math.floor(Math.random() * keys.length)];
        

        // check if given monster type exists
        if(typeof this.monsters[type] === "undefined") 
            throw new TypeError('invalid monster type "' + type + '"');
        

        var monster =  ;

        /*
         * This allows you to add new attributes and not have to change any
         * of this code, except the attributes object for each monster.
         */
        for(var attribute in this.monsters[type]) 
            if(this.monsters[type].hasOwnProperty(attribute)) 
                var a = this.monsters[type][attribute];

                if(typeof a == "object") 
                    a = Math.floor(Math.random() * (a[1] - a[0] + 1) + a[0]);
                

                monster[attribute] = a;
            
        

        return monster;
    
;

console.log(Monster.create('rat'));
console.log(Monster.create('spider'));
console.log(Monster.create());

这就是我要做的,这很好,很简单,并且可以在将来轻松添加怪物和属性:

var Monster = 
    monsters: 
        rat: 
            attack: [5, 9],
            defense: [3, 5],
        ,

        spider: 
            attack: [6, 11],
            defense: [4, 5]
        
    ,

    create: function(type) 
        // check if given monster type exists
        if(typeof this.monsters[type] === "undefined") 
            throw new TypeError('invalid monster type "' + type + '"');
        

        var monster =  ;

        /*
         * This allows you to add new attributes and not have to change any
         * of this code, except the attributes object for each monster.
         */
        for(var attribute in this.monsters[type]) 
            if(this.monsters[type].hasOwnProperty(attribute)) 
                var a = this.monsters[type][attribute];
                monster[attribute] = Math.floor(Math.random() * (a[1] - a[0] + 1) + a[0]);
            
        

        return monster;
    
;

console.log(Monster.create('rat'));
console.log(Monster.create('spider'));

【讨论】:

我很抱歉延迟回答这个问题,是的,上面的模型给了我一些关于我将使用什么的提示。由于许多其他事情,我最终推迟了上述游戏的开发。但这确实帮助我澄清了很多事情 很高兴它有帮助。我也做了一些改进。看看吧。

以上是关于游戏组件的Javascript类结构的主要内容,如果未能解决你的问题,请参考以下文章

无法重置布尔值 - Javascript

从 PHP 获取信息到 HTML5 JavaScript 游戏

如何通过实体组件系统在Javascript中构建游戏

45.VUE学习之--组件之父组件使用scope定义子组件模板样式结构实例讲解

JavaScript概述

javascript的理解及经典案例