Javascript: 合并 random( ) 开始

Javascript: Incorporating random( ) start

请帮忙完成这个程序。使用数组、循环和条件下雨是可汗学院的一项挑战。我应该:

  1. 向数组添加更多滴。
  2. 让水滴在到达底部后重新回到顶部,使用条件。
  3. 制作一个颜色数组,让每一滴都是不同的颜色。
  4. 让其他东西下雨,比如雪花(使用更多形状命令)或头像(使用图像命令)。
  5. 这样当用户点击时,一个新的水滴被添加到数组中。
  6. 在程序开始时使用 for 循环和 random() 函数初始化数组。

我已经完成了#1、#2 和#5,我可以完成#3 和 4...但是我一辈子都想不出如何完成#6。我知道它与 random(0, 400) 命令有关,但我不确定如何让它工作。

代码如下:

// need random x value
// need random start times

// position of the rain at top
var xPositions = [1, 50, 100, 150, 200, 250, 300, 350, 399];
var yPositions = [0, 0, 0, 0, 0, 0, 0, 0, 0];

// attempt at defining a variable for random start
// don't know what to do with it after this
var raindrops = [random(0, 400)];

// rain falling from top to bottom at specific intervals
var draw = function() {
    background(113, 218, 237);

    for (var i = 0; i < xPositions.length; i++) {
        noStroke();
        fill(21, 143, 173);
        ellipse(xPositions[i], yPositions[i], 10, 10);
         if (yPositions[i] < 390) {
    yPositions[i] += 5; //makes rain fall down
    } else {
        yPositions[i] = 0;
    }        
}

for (var j = 0; j < xPositions.length; j++) {
            noStroke();
            fill(21, 143, 173);
            ellipse(xPositions[j] + 25, yPositions[j]-50, 10, 10);
        }

    for (var k = 0; k < xPositions.length; k++) {
            noStroke();
            fill(21, 143, 173);
            ellipse(xPositions[k], yPositions[k]-100, 10, 10);
        }
    };


// click to add more raindrops
var mouseClicked = function() {
    xPositions.push(mouseX);
    yPositions.push(mouseY);
};

感谢您的意见。

将此函数添加到您的代码中并更新您的随机调用。

function randomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
}

-

var raindrops = randomInt(0, 400);

或(请注意,您的问题中似乎没有足够的信息来准确回答这个问题,但这里有一个将随机值添加到数组的循环):

var minRain = 1;
var maxRain = 400;
var rainLen = 100;
var rain = [];
for (var i = 0; i < rainLen; i++) {
    rain.push(randomInt(minRain, maxRain));
}
function randomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
}

我想通了:

// click to add more rain

// position of the rain at top
var xPositions = [1, 50, 100, 150, 200, 250, 300, 350, 399];
var yPositions = [0, 0, 0, 0, 0, 0, 0, 0, 0];
var rainspeed = [1, 4, 2, 6, 3, 8, 5, 3, 4];

// rain falling from top to bottom at defined intervals
var draw = function() {
    background(113, 218, 237);

    for (var i = 0; i < xPositions.length; i++) {
        noStroke();
        fill(60, 163, 232);
        ellipse(xPositions[i], yPositions[i], 6, 12);
    if (yPositions[i] < 395) {
        yPositions[i] += rainspeed[i]; //makes rain fall down
    } else {
        yPositions[i] = 0; //takes rain back to top
    }
    }

};


// click to add more raindrops
var mouseClicked = function() {
    xPositions.push(mouseX);
    yPositions.push(mouseY);
    rainspeed.push(random(2,8));
};