5

我正在使用 JavaScript 制作游戏，并且我创建了一颗垂直移动并选择随机x位置的小行星。

如何创建多个选择随机起点的小行星？

以下是我目前对小行星的了解：

//create asteroid
asteroid={
    x:width/2,
    y:-6,
    min:1.6,
    max:2.2,
    speed:1.6
}

// move asteroid
if(asteroid.y<height){
    asteroid.y+=asteroid.speed;
}else{
    asteroid.y=-6;
    asteroid.x=Math.random()*(width-0)-0;
}

//draw asteroid
ctx.beginPath();
ctx.fillStyle = "#D9BA5F";
ctx.arc(asteroid.x, asteroid.y,3,0,2*Math.PI,false);
ctx.closePath();
ctx.fill();
4

3 回答 3

6

将您的移动和绘制例程放入小行星对象的方法中：

// Define an Asteroid constructor
function Asteroid(width, height) {
    this.width = width;
    this.height = height;
    this.x = width/2;
    this.y = -6;
    this.min = 1.6;
    this.max = 2.2;
    this.speed = 1.6;
}

// Move asteroid
Asteroid.prototype.move = function() {
    if(this.y < this.height) {
        this.y += this.speed;
    } else {
        this.y = -6;
        this.x = Math.random()*(this.width-0)-0;
    }
}

// Draw asteroid
Asteroid.prototype.draw = function() {
    ctx.beginPath();
    ctx.fillStyle = "#D9BA5F";
    ctx.arc(this.x, this.y, 3, 0, 2*Math.PI, false);
    ctx.closePath();
    ctx.fill();
}

然后你可以创建多个小行星：

var asteroids = [];
// create 10 asteroids
for(var i = 0; i < 10; i++) {
    asteroids.push(new Asteroid(Math.random()*10, Math.random()*10));
}

在你的主循环中，移动并绘制它们：

for(var i = 0; i < asteroids.length; i++) {
    asteroids[i].move();
    asteroids[i].draw();
}

正如@blunderboy 在评论中指出的那样，这仍然不会随机化您尚未随机化的任何东西。您可以使用 Powerslave 的参数化构造函数，其中所有随机化都应在实例化时进行，或者从构造函数中生成至少部分随机值。

此外，最好传递画布上下文对象而不是依赖闭包。

于 2013-05-26T02:45:23.277 回答
2

创建构造函数而不是静态 JSON 对象。

function Asteroid(x, y, min, max, speed) {
    this.x = x;
    this.y = y;
    this.min = min;
    this.max = max;
    this.speed = speed;
}

然后你可以创建一个小行星，如下所示：

var asteroid = new Asteroid(width / 2, -6, 1.6, 2.2, 1.6);

注意：这不是最佳的方法，而是一种非常简单的方法。对于最佳解决方案，您将应用封装、设计模式等。

编辑：有关封装小行星相关功能和整个方法的更多详细信息，请参阅 bfavaretto 的答案。

于 2013-05-26T02:50:10.473 回答
0

将其放入一个for循环中，并设置n为调用该函数时所需的小行星数量。

像这样的东西：

function createAsteroid(n) {

   for (var i = 1; i < n; i++) {

     //create asteroid
     asteroid[i] = {
         x : width/2,
         y : -6,
         min : 1.6,
         max : 2.2,
         speed : 1.6
     }

     // move asteroid
     if (asteroid[i].y < height) {
         asteroid[i].y+ = asteroid.speed;
     }
     else {
         asteroid[i].y = -6;
         asteroid[i].x = Math.random() * (width-0) -0;
     }
     return asteroid;
}

我没有测试过这段代码，但它背后的逻辑思想是合理的。

于 2013-05-26T02:43:15.700 回答