有很多僵尸（X/Y 变量、大小、健康），无需手动单独创建每个僵尸

Question

我和我的朋友正在制作一个 2D FPS 游戏（不要问怎么做，太复杂了），但我们有一个简单的系统，其中有 3 个僵尸，每个都有不同的命中框，具体取决于 close/far 他们都是，健康。我们的问题是我们想为此创建一个开放的世界（我们已经确切地知道如何，再一次不要问，太复杂了），我们不想为每个僵尸的健康、位置和大小创建一个变量（ closeness），我们如何在随机区域（在特定边界内随机）制造许多僵尸，并且它们每个仍然有命中框、生命值和类似的东西？我们知道它是可能的，因为它在许多其他游戏中都是这样做的，但我们不知道如何，我们正在使用一个名为 Processing.JS.

的 JS 框架

编辑

感谢@Kevin Workman 为我提供了一些非常有用的代码，但仍然存在问题，他为每个具有唯一 X 和 Y 但不是唯一生命值的僵尸提供了代码，我获取了他的代码并尝试修改它添加这个，但现在生命值停留在 100。有什么帮助吗？

ArrayList<Zombie> zombies = new ArrayList<Zombie>();
void setup(){
   size(500, 500);
   for(int i = 0; i < 100; i++){
  zombies.add(new Zombie());
   }
}
void draw(){
   background(0);
   for(Zombie z : zombies){
      z.draw();
   }
}
class Zombie{
   float x = random(500);
   float y = random(500);
   float r = random(5, 20);
   float h = 100;
   void draw(){
      fill(0, 255, 0);
        if(h > 0) {
      ellipse(x, y, r, r);
        }
      if(mouseX > x - r/2 && mouseX < x + r/2 && mouseY > y - r/2 && mouseY < y + r/2 && mousePressed) {
    h --;
  }
  println(h);
  }
}

Answer 1

如果这是一个单人游戏（即没有 networking/servers），那么您可以简单地将生命值（以及其余的单个僵尸特定细节）存储在僵尸对象中。

这是一个简单的基于 jQuery/DOM 的示例（抱歉，它不是 processing.js，但我以前没有使用过它，只是想提供一个快速和基本的示例）：

Fiddle: https://jsfiddle.net/dg5p6c08/

$(function() {
    // namespace
    var ZOMBIEGAME = ZOMBIEGAME || {};
    // zombie class
    ZOMBIEGAME.zombie = function () {
        this.health = 3;
        this.x = 0;
        this.y = 0;
        this.dead = false;
        this.takeDamage = function (damage) {
            this.health -= damage;
            if (this.health < 1) {
                this.dead = true;
            }
        }
    }
 // make zombie objects
    var zombies = [];
    for (var i = 0; i < 10; i++) {
        var z = new ZOMBIEGAME.zombie();
        z.x = Math.floor(Math.random() * 480);
        z.y = Math.floor(Math.random() * 480);
        zombies.push(z);
    }
 // make DOM zombies
    for (var i = 0; i < zombies.length; i++) {
        var zDom = '<div class="zombie" data-id="' + i + '" style="top: '
         + zombies[i].y + 'px; left: ' + zombies[i].x + 'px;"></div>';
        $('#game').append(zDom);
    }
    // click zombies
    $('.zombie').on('click', function() {
     var id = parseInt($(this).attr('data-id'));
        zombies[id].takeDamage(1);
        if (zombies[id].dead) {
            $(this).css('background', '#bbb');
        }
    });
});

body {
    font-family: sans-serif;
}
#game {
    width: 512px;
    height: 512px;
    position: relative;
    background: #ddd;
}
.zombie {
    width: 32px;
    height: 32px;
    background: #A1D490;
    position: absolute;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Click zombies 3 times to kill.</p>
<div id="game"></div>

Answer 2

因为你使用的是Processing.js，你可以使用class来封装你的数据需要跟踪每个僵尸。 Here 是使用 classes 的 Processing.js 参考。一个简单的示例可能如下所示：

ArrayList<Zombie> zombies = new ArrayList<Zombie>();

void setup(){
   size(500, 500);
   for(int i = 0; i < 100; i++){
      zombies.add(new Zombie());
   }
}

void draw(){
   background(0);
   for(Zombie z : zombies){
      z.draw();
   }
}

class Zombie{
   float x = random(500);
   float y = random(500);
   float r = random(5, 20);

   void draw(){
      fill(0, 255, 0);
      ellipse(x, y, r, r);
   }
}

有很多僵尸（X/Y 变量、大小、健康），无需手动单独创建每个僵尸

Have Many Zombies(X/Y Variables, Size, Health) Without Manually Creating Each One Individually

javascript

processing

processing.js