JavaScript 原子 : Array Problems

Question

因此，对于最终项目，我尝试制作一款包含三种不同 meteor 的游戏；铜牌、银牌和金牌。虽然青铜阵列在Setup()中工作正常，但银色和金色 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
// 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();
      }
    }

我尝试过改变速度，使级别错误，除了青铜 meteor 之外没有任何效果。

Answer 1

您的 2 级和 3 级 meteor 初始化位于绘制循环内。它们包含一个 meteor = [] 语句。根据您提供的信息，这表明您的 meteor 阵列在每次绘制迭代时都会被清除。他们永远没有机会移动，你每次都会得到新鲜的随机 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 之类的关卡初始化标志。

如果你想保留上一关的 meteor ，你可以这样做:

  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