How can I delete an object when it's not stored in an array?

Question

I have a boss appearing in my game, but since it's only one character I didn't put it in an array. Now I'm trying to make disappear if its health is less or equal to 0 but I don't know how to do that. Is there a way to remove the object? I only know how to remove a property of an object.

Here's the boss object:

function Boss1(x, y) {
    this.sprite = boss1Sprite;
    this.x = x;
    this.y = y;
    this.imgWidth = 160;
    this.imgHeight = 224;
    this.frameWidth = this.imgWidth / 4;
    this.frameHeight = this.imgHeight / 4;
    this.health = 1500;
    this.directionMode = 1;
    this.currentFrame = 0;
    this.SPEED = 1;
    this.delta = 1;
    this.updateFrame = function () {
        this.currentFrame += 0.2;
    }
    this.showHealth = function () {
        ctx.fillStyle="red";
        ctx.fillRect(this.x,this.y - 10,(this.health/100)*3.3,5);
        ctx.strokeRect(this.x, this.y-10, (100/100) * 50, 5);
    }
    this.show = function () {
        this.updateFrame();
        this.walkingMode = Math.floor(this.currentFrame) % 4;
        ctx.drawImage(this.sprite, this.walkingMode * this.frameWidth, this.directionMode * this.frameHeight, this.frameWidth, this.frameHeight, this.x, this.y, this.frameWidth, this.frameHeight);
    }
    //target == hero
    //position == this
    this.move = function () {
        this.dx = hero.x - this.x;
        this.dy = hero.y - this.y;
        this.length = Math.sqrt(this.dx * this.dx + this.dy * this.dy);
        if (this.length) {
            this.dx = this.dx / this.length;
            this.dy = this.dy / this.length;
        }
        this.x += this.dx * this.delta * this.SPEED;
        this.y += this.dy * this.delta * this.SPEED;
    }
}

//enemy wave object
function random(min, max) {
    return Math.random() * (max - min) + min;
}
function Enemy(x, y){
    this.sprite = enemySprite;
    this.x = x;
    this.y = y;
    this.imgWidth = 128;
    this.imgHeight = 192;
    this.frameWidth = this.imgWidth / 4 ;
    this.frameHeight = this.imgHeight / 4;
    this.toDelete = false;
    this.dx = random(1, 3);
    this.enemiesHealth = 100;
    this.directionMode = 1;
    this.currentFrame = 0;
    this.updateFrame = function(){
        this.currentFrame += 0.2;
    }
    this.showHealth = function (){
        ctx.fillStyle="red";
        ctx.fillRect(this.x,this.y - 10,(this.enemiesHealth/100)*50,5);
        ctx.strokeRect(this.x, this.y-10, (100/100) * 50, 5);
    }
    this.show = function(){
        this.updateFrame();
        this.walkingMode = Math.floor(this.currentFrame) % 4;
        ctx.drawImage(this.sprite,this.walkingMode * this.frameWidth, 
        this.directionMode * this.frameHeight, this.frameWidth, this.frameHeight, 
        this.x, this.y, this.frameWidth, this.frameHeight );
    }
    this.move = function(){
        this.x = this.x - this.dx;
    }
    this.deletion = function(){
        this.toDelete = true;
    }
}

//this is when the boss is spawning
//the game loop
function draw() {
    bullets = bullets.filter((bullet) => bullet.x <= viewLimit);
    enemies = enemies.filter((enemy) => enemy.x >= viewLimit1);
    while (enemies.length <= enemiesPerTick && kills <= 5) {
        var enemy = new Enemy(canvas.width, random(0, canvas.height - 60));
        enemies.push(enemy);
    }
    for (var v = 0; v < enemies.length; v++) {
        enemies[v].showHealth();
    }
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    hero.show();
    hero.update();
    hero.showHealth();
    for (var i = 0; i < bullets.length; i++) {
        bullets[i].show();
        bullets[i].move();
    }
    for (var j = 0; j < enemies.length; j++) {
        enemies[j].show();
        enemies[j].move();
    }
    for (var t = 0; t < enemies.length; t++) {
        enemies[t].showHealth();
    }
    collision();
    drawScore();
    if (enemies.length == 0) {
        boss1.show();
        boss1.move();
        boss1.showHealth();
    }

    requestAnimationFrame(draw);
}

console.log(enemies, bullets);
draw();

i updated the code, if you need more information , let me know — Chrissisbeast
– Chrissisbeast, Commented Jul 10, 2019 at 10:53
Okay, so that needs to be in your question too. Please don't make us beg for your code piecemeal — a minimal complete verifiable example is standard procedure. — DMGregory
– DMGregory ♦, Commented Jul 10, 2019 at 11:03
Right, which is why you take the time to make a Minimal, Complete, Verifiable Example: all the code needed to diagnose your problem, and no more. No one is asking for your whole game — we're asking you to do the work of isolating the relevant parts of your code, so that you can get timely and high-quality answers that don't overlook important details. — DMGregory
– DMGregory ♦, Commented Jul 10, 2019 at 11:05

Philipp · Accepted Answer · 2019-07-10 15:19:44Z

Only show and update the boss when its health is larger than 0:

        if (enemies.length == 0 && boss1.health > 0) {
            boss1.show();
            boss1.move();
            boss1.showHealth();
        }

However, for a more extensible architecture you might want to handle the boss just like any other enemy. Push it onto the enemies array when the spawn condition is met and remove it from the enemies array when its defeat condition is met.

In order for your draw-loop to work with the boss just like it works with any other enemy, it needs all the same fields and functions. An elegant way to do that in Javascript is to create the boss as a regular enemy and then overwrite all functions and fields on that enemy object where the boss differs from a regular enemy.

Or even use prototype inheritance. Create an enemy base-class with all the functionality all enemies in your game have in common. Then create classes for every type of enemy you have in your game, including boss enemies, which use that base class as a prototype.

Now thats a helpful anwer , you made my life so much easier dude , thank you so much . — Chrissisbeast
– Chrissisbeast, Commented Jul 10, 2019 at 15:15

Bálint · Accepted Answer · 2019-07-10 10:00:11Z

0

If simply not drawing it when its health is 0 isn't enough, you can just set the variable to null. This won't affect the memory immediately, but since JavaScript is garbage collected, unless you have multiple global references to it, it will eventually get deleted when space is needed

edited Jul 10, 2019 at 10:00

answered Jul 10, 2019 at 9:51

Bálint

15.1k2 gold badges38 silver badges57 bronze badges

\$\begingroup\$ On top of that, one can use the delete keyword, to remove the reference to an object. It's the same as setting the variable to null, but I think its cleaner as the variable is now undefined and does not appear when you do console.logs or something similar. As far as I'm aware, this doesn't have any different behaviour on garbage collection. \$\endgroup\$

Tom Tsagkatos
– Tom Tsagkatos

2019-07-10 10:36:05 +00:00
Commented Jul 10, 2019 at 10:36
\$\begingroup\$ It looks like they're still calling boss1.show() in their game loop, so they'll need a branch to skip over those lines and avoid errors, yes? \$\endgroup\$

DMGregory
– DMGregory ♦

2019-07-10 11:05:04 +00:00
Commented Jul 10, 2019 at 11:05

Add a comment |

Stack Exchange Network

How can I delete an object when it's not stored in an array?

2 Answers 2

You must log in to answer this question.

Hot Network Questions

How can I delete an object when it's not stored in an array?

2 Answers 2

You must log in to answer this question.

Related

Hot Network Questions