JavaScript project Bug Invaders

I keep running into a syntax error and I don’t see anything wrong with my code. It would be great if someone could assist me.

here is my code:

function preload() {

this.load.image(‘bug1’, ‘https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bug_1.png’);

this.load.image(‘bug2’, ‘https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bug_2.png’);

this.load.image(‘bug3’, ‘https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bug_3.png’);

this.load.image(‘platform’, ‘https://content.codecademy.com/courses/learn-phaser/physics/platform.png’);

this.load.image(‘codey’, ‘https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/codey.png’);

this.load.image(‘bugPellet’, ‘https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bugPellet.png’);

this.load.image(‘bugRepellent’, ‘https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bugRepellent.png’);

}

// Helper Methods below:

// sortedEnemies() returns an array of enemy sprites sorted by their x coordinate

function sortedEnemies(){

const orderedByXCoord = gameState.enemies.getChildren().sort((a, b) => a.x - b.x);

return orderedByXCoord;

}

// numOfTotalEnemies() returns the number of total enemies

function numOfTotalEnemies() {

const totalEnemies = gameState.enemies.getChildren().length;

return totalEnemies;

}

const gameState = {};

function create() {

// When gameState.active is true, the game is being played and not over. When gameState.active is false, then it’s game over

gameState.active = true;

// When gameState.active is false, the game will listen for a pointerup event and restart when the event happens

this.input.on(‘pointerup’, () => {

if (gameState.active === false) {

  this.scene.restart();

}

})

// Creating static platforms

const platforms = this.physics.add.staticGroup();

platforms.create(225, 490, ‘platform’).setScale(1, .3).refreshBody();

// Displays the initial number of bugs, this value is initially hardcoded as 24

gameState.scoreText = this.add.text(175, 482, ‘Bugs Left: 24’, { fontSize: ‘15px’, fill: ‘#000000’ });

// Uses the physics plugin to create Codey

gameState.player = this.physics.add.sprite(225, 450, ‘codey’).setScale(.5);

// Create Collider objects

gameState.player.setCollideWorldBounds(true);

this.physics.add.collider(gameState.player, platforms);

// Creates cursor objects to be used in update()

gameState.cursors = this.input.keyboard.createCursorKeys();

// Add new code below:

gameState.enemies = this.physics.add.group()

for (yVal = 1; yVal < 4; yVal++) {

for(xVal = 1; xVal < 9; xVal++) {

  gameState.enemies.create(50 * xVal, 50 * yVal, 'bug1').setScale(.6).setGravityY(-200)

}

}

const pellets = this.physics.add.group()

const genPellet = () => {

let randomBug = Phaser.Utils.Array.GetRandom(gameState.enimies.getChildren())

pellets.create(randomBug.x, randomBug.y, 'bugPellet')

}

gameState.pelletsLoop = this.time.addEvent({

delay: 300,

callback: genPellet,

callbackScope: this,

loop: true,

})

}

function update() {

if (gameState.active) {

// If the game is active, then players can control Codey

if (gameState.cursors.left.isDown) {

  gameState.player.setVelocityX(-160);

} else if (gameState.cursors.right.isDown) {

  gameState.player.setVelocityX(160);

} else {

  gameState.player.setVelocityX(0);

}

// Execute code if the spacebar key is pressed

if (Phaser.Input.Keyboard.JustDown(gameState.cursors.space)) {

  

}

// Add logic for winning condition and enemy movements below:

}

}

const config = {

type: Phaser.AUTO,

width: 450,

height: 500,

backgroundColor: “b9eaff”,

physics: {

default: 'arcade',

arcade: {

  gravity: { y: 200 },

  enableBody: true,

}

},

scene: {

preload,

create,

update

}

};

const game = new Phaser.Game(config);

here is the error message:

Uncaught TypeError: Cannot read property ‘getChildren’ of undefined
at initialize.genPellet (game.js:64)
at initialize.update (phaser.min.js:1)
at initialize.h.emit (phaser.min.js:1)
at initialize.step (phaser.min.js:1)
at initialize.update (phaser.min.js:1)
at initialize.step (phaser.min.js:1)
at initialize.step (phaser.min.js:1)
at e (phaser.min.js:1)

Hey spurz3412! :slight_smile: How are you doing?

I may be able to help you, but I need to see your code in a better format to figure out where the issue may be. Follow the guidelines of the Forum:

You can either:

  • add three backticks ``` in newlines before and after your code block
  • or simply copypaste your code inside the <code> tags when you create a Codebyte.

function preload() { this.load.image('bug1', 'https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bug_1.png'); this.load.image('bug2', 'https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bug_2.png'); this.load.image('bug3', 'https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bug_3.png'); this.load.image('platform', 'https://content.codecademy.com/courses/learn-phaser/physics/platform.png'); this.load.image('codey', 'https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/codey.png'); this.load.image('bugPellet', 'https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bugPellet.png'); this.load.image('bugRepellent', 'https://content.codecademy.com/courses/learn-phaser/Bug%20Invaders/bugRepellent.png'); } // Helper Methods below: // sortedEnemies() returns an array of enemy sprites sorted by their x coordinate function sortedEnemies(){ const orderedByXCoord = gameState.enemies.getChildren().sort((a, b) => a.x - b.x); return orderedByXCoord; } // numOfTotalEnemies() returns the number of total enemies function numOfTotalEnemies() { const totalEnemies = gameState.enemies.getChildren().length; return totalEnemies; } const gameState = {}; function create() { // When gameState.active is true, the game is being played and not over. When gameState.active is false, then it's game over gameState.active = true; // When gameState.active is false, the game will listen for a pointerup event and restart when the event happens this.input.on('pointerup', () => { if (gameState.active === false) { this.scene.restart(); } }) // Creating static platforms const platforms = this.physics.add.staticGroup(); platforms.create(225, 490, 'platform').setScale(1, .3).refreshBody(); // Displays the initial number of bugs, this value is initially hardcoded as 24 gameState.scoreText = this.add.text(175, 482, 'Bugs Left: 24', { fontSize: '15px', fill: '#000000' }); // Uses the physics plugin to create Codey gameState.player = this.physics.add.sprite(225, 450, 'codey').setScale(.5); // Create Collider objects gameState.player.setCollideWorldBounds(true); this.physics.add.collider(gameState.player, platforms); // Creates cursor objects to be used in update() gameState.cursors = this.input.keyboard.createCursorKeys(); // Add new code below: gameState.enemies = this.physics.add.group() for (yVal = 1; yVal < 4; yVal++) { for(xVal = 1; xVal < 9; xVal++) { gameState.enemies.create(50 * xVal, 50 * yVal, 'bug1').setScale(.6).setGravityY(-200) } } const pellets = this.physics.add.group() const genPellet = () => { let randomBug = Phaser.Utils.Array.GetRandom(gameState.enimies.getChildren()) pellets.create(randomBug.x, randomBug.y, 'bugPellet') } gameState.pelletsLoop = this.time.addEvent({ delay: 300, callback: genPellet, callbackScope: this, loop: true, }) } function update() { if (gameState.active) { // If the game is active, then players can control Codey if (gameState.cursors.left.isDown) { gameState.player.setVelocityX(-160); } else if (gameState.cursors.right.isDown) { gameState.player.setVelocityX(160); } else { gameState.player.setVelocityX(0); } // Execute code if the spacebar key is pressed if (Phaser.Input.Keyboard.JustDown(gameState.cursors.space)) { } // Add logic for winning condition and enemy movements below: } } const config = { type: Phaser.AUTO, width: 450, height: 500, backgroundColor: "b9eaff", physics: { default: 'arcade', arcade: { gravity: { y: 200 }, enableBody: true, } }, scene: { preload, create, update } }; const game = new Phaser.Game(config);

image

the error given to you is:

Uncaught TypeError: Cannot read property ‘getChildren’ of undefined
at initialize.genPellet (game.js:64)
at initialize.update (phaser.min.js:1)
at initialize.h.emit (phaser.min.js:1)
at initialize.step (phaser.min.js:1)
at initialize.update (phaser.min.js:1)
at initialize.step (phaser.min.js:1)
at initialize.step (phaser.min.js:1)
at e (phaser.min.js:1)

Which basically is the console telling you roughly this:
Hey @spurz3412! In the following files at the specified lines of code there’s something you want me to do (read) but I cannot do that, because that thing is undefined (it has no value).

You can see that all the files minus one are the phaser library. One file is your code. So the error is either in the library or in your code.

In your code at line 64 there’s indeed a typo, enimies is not a property of the gameState object, if it’s not a property than it’s value is considered undefined. Here’s a quick example (ignore the first undefined, as it’s just an echo of the first declaration in console):

image

1 Like

Thank you so much. I really can’t believe it was such small error.

1 Like

You’re welcome, it happens all the time! :slight_smile: