Javascript Atom：数组问题

Question

因此，对于最后的项目，我试图用三种不同的流星制作游戏；青铜，银和金。虽然在Setup（）中铜牌阵列工作正常，但由于某些未知原因，银和金流星高速运转。

function setup() {
  createCanvas(windowWidth, windowHeight);
  spaceship = new Spaceship(100, 100, 5, spaceshipImage, bulletImage, 40);
  healthStar = new Star(1000, 100, 10, healthStarImage, 50);


//the Meteor Array
// Run a for loop numMeteor times to generate each meteor and put it in the array
// with random values for each star
for (let i = 0; i < numMeteor; i++) {
  let meteorX = random(0, width);
  let meteorY = random(0, height);
  let meteorSpeed = random(2, 20);
  let meteorRadius = random(10, 60);
  meteor.push(new Meteor(meteorX, meteorY, meteorSpeed, meteorBronzeImage, meteorRadius));
  }
}

// draw()
//
// Handles input, movement, eating, and displaying for the system's objects
function draw() {
// Set the background to a safari scene
  background(skyBackground);
// Check if the game is in play
  if (playing == true) {

// Handle input for the tiger
  spaceship.handleInput();

// Move all the "animals"
  spaceship.move();
  healthStar.move();

if (spaceship.dodges >= 5){
  levelTwo = true;
}
  //lvl 2
  if (levelTwo == true){
    meteor = [];
    for (let i = 0; i < numMeteor; i++) {
      let meteorX = random(0, width);
      let meteorY = random(0, height);
      let meteorSpeed = random(2, 20);
      let meteorRadius = random(10, 60);
      meteor.push(new Meteor(meteorX, meteorY, meteorSpeed, meteorSilverImage, meteorRadius));
  }
}

if (spaceship.dodges >= 8){
  levelThree = true;
}
//lvl 3
if (levelThree == true){
  levelTwo = false;
  meteor = [];
      for (let i = 0; i < numMeteor; i++) {
      let meteorX = random(0, width);
      let meteorY = random(0, height);
      let meteorSpeed = random(2, 20);
      let meteorRadius = random(10, 60);
      meteor.push(new Meteor(meteorX, meteorY, meteorSpeed, meteorGoldImage, meteorRadius));
    }
}

// Handle the tiger and lion eating any of the star
  spaceship.handleEating(healthStar);

  //
  spaceship.handleBullets();

// Handle the tragic death of the tiger
  spaceship.handleDeath();

// Check to see when the game is over
  checkGameOver();

// Display all the "animals"
  spaceship.display();
  healthStar.display();

// Display and making sure the tiger can eat the copies of the star
for (let i = 0; i < meteor.length; i++) {
meteor[i].move();
meteor[i].display();
//meteor[i].handleDamage();
spaceship.handleHurting(meteor[i]);
spaceship.handleDodging(meteor[i]);

}
 }
   // Once the game is over, display a Game Over Message
 if (gameOver == true) {
    displayGameOver();
  }
    // Otherwise we display the message to start the game
  else {
    displayStartMessage();
      }
    }

我试图改变速度，将水平设为虚假，除了青铜流星以外，什么都没有起作用。

Answer 1

您的2级和3级流星初始化位于绘制循环内。它们包括meteor = []语句。从您提供的信息来看，这表明您的流星阵列在每次绘制迭代中都会被清除。它们永远没有移动的机会，每次您都会获得新鲜的随机流星。

如果实际上是在绘制循环中清除数组的问题，则需要添加一种方法来跟踪级别初始化是否已完成，以使其仅发生一次。一个简单的标志，一个幂等函数，诸如此类。]

// Extract meteor generation to it's own function so you dont need to repeat it
function generateMeteors(meteorImage) {
  let meteor = [];
  for (let i = 0; i < numMeteor; i++) {
    let meteorX = random(0, width);
    let meteorY = random(0, height);
    let meteorSpeed = random(2, 20);
    let meteorRadius = random(10, 60);
    meteor.push(new Meteor(meteorX, meteorY, meteorSpeed, meteorBronzeImage, meteorRadius));
  }
  return meteor;
}


function setup() {
  createCanvas(windowWidth, windowHeight);
  spaceship = new Spaceship(100, 100, 5, spaceshipImage, bulletImage, 40);
  healthStar = new Star(1000, 100, 10, healthStarImage, 50);


  //the Meteor Array
  // meteor is apparently global, or otherwise in scope here
  meteor = generateMeteors(meteorBronzeImage)  
}


function draw() {
 /**  
    Code removed for clarity  
 **/

  if (spaceship.dodges >= 5) {
    levelTwo = true;
  }
  //lvl 2
  // levelTwoInitialized tracks if we've initialized the meteor array for this level
  if (levelTwo == true && levelTwoInitialized == false){
    meteor = generateMeteors(meteorSilverImage);
    levelTwoInitialized = true;
  }

  if (spaceship.dodges >= 8){
    levelThree = true;
  }
  //lvl 3
  // levelThreeInitialized tracks if we've initialized the meteor array for this level
  if (levelThree == true && levelThreeInitialized == false){
    levelTwo = false;
    meteor = generateMeteors(meteorGoldImage);
    levelThreeInitialized = true;
  } 

  //... rest of code
以上的一种可行方法。无论您要跟踪游戏/程序状态的何处，都必须在某处声明levelThreeInitialized之类的级别初始化标志。

如果您想保留先前级别的流星，可以执行以下操作：

  if (levelTwo == true && levelTwoInitialized == false){
    // add silver meteors to the existing bronze set
    meteor = meteor.concat(generateMeteors(meteorSilverImage));
    levelTwoInitialized = true;
  }
  //... rest of code

如果要创建具有多种类型的新集合：

  if (levelTwo == true && levelTwoInitialized == false){
    // make NEW silver and bronze meteors
    meteor = generateMeteors(meteorSilverImage)
                .concat(generateMeteors(meteorBronzeImage);
    levelTwoInitialized = true;
  }
  //... rest of code