problem with if statement in instance method-CodePudding

HP are supposed to reset to 0 when its 0 or under But i guess my condition isnt good because it can go under 0.

And i dont understand why when i attack the opponent, it check the wrong opponent. pic of error Here is the translate of the screenshot :

in the console it say : Luffy is alive.

in the html it say : Luffy attacked Naruto and remove him 8HP <- so this code is fine

Luffy HP : 100 <- this is fine because he didnt get attack Naruto HP : -10 <- this is NOT fine because my instance method checkHealth is suppose to see that he reach 0hp and under.

So checkHealth check the wrong character, it check Luffy the attackers but i want it to check Naruto HP to see if HP are <= 0.

I tried this code and it works but it not very good to do like this bc its not very optimized :

    checkHealth (narutoCharacter){ 
        if (narutoCharacter.health <=0){
            narutoCharacter.health = 0;
            popUp.style.display = 'inline';
            popUp.innerText = narutoCharacter.name  ' est mort.';
        } else {
            console.log (narutoCharacter.name   ' est en vie');
        }
    }
    checkHealth (luffyCharacter){ 
        if (luffyCharacter.health <=0){
            luffyCharacter.health = 0;
            popUp.style.display = 'inline';
            popUp.innerText = luffyCharacter.name  ' est mort.'
        } else {
            console.log (luffyCharacter.name   ' est en vie');
        }
    }

Here is my if statement in my instance method :

    checkHealth (){ 
        if (this.health <=0){
            this.health = 0;
            popUp.style.display = 'inline';
            popUp.innerText = this.name  ' est mort.'
        } else {
            console.log (this.name   ' est en vie');
        }
    }

Here is the complete code of my javascript file :

class Character {
    constructor (name,type,health,attack,level){
        this.name = name;
        this.type = type;
        this.health = health;
        this.attack = attack;
        this.level = level;
    }
    levelUp (){
        this.level  ;
        popUp.style.display = 'inline';
        popUp.innerText = this.name  ' passe au niveau '  this.level;
    }
    // checkHealth (){ 
    //     if (this.health <=0){
    //         this.health = 0;
    //         popUp.style.display = 'inline';
    //         popUp.innerText = this.name  ' est mort.'
    //     } else {
    //         console.log (this.name   ' est en vie');
    //     }
    // }
    checkHealth (narutoCharacter){ 
        if (narutoCharacter.health <=0){
            narutoCharacter.health = 0;
            popUp.style.display = 'inline';
            popUp.innerText = narutoCharacter.name  ' est mort.';
        } else {
            console.log (narutoCharacter.name   ' est en vie');
        }
    }
    checkHealth (luffyCharacter){ 
        if (luffyCharacter.health <=0){
            luffyCharacter.health = 0;
            popUp.style.display = 'inline';
            popUp.innerText = luffyCharacter.name  ' est mort.'
        } else {
            console.log (luffyCharacter.name   ' est en vie');
        }
    }
    get informations (){
        infoPopUp.innerText = this.name   ' '   this.type   ' a '   this.health   ' hp et est au niveau '  this.level;
        tempMessage.style.display = 'inline';
    }
}
class Ninja extends Character {
    constructor (name, type, health, attack, level){
        super (name, type, health, attack, level)
    }
    attackEnemy (luffyCharacter){
        luffyCharacter.health -= narutoCharacter.attack;
        this.levelUp ();
        popUp.style.display = 'inline';
        popUp.innerText = narutoCharacter.name   ' attaque '   luffyCharacter.name   ' et lui enlève '   narutoCharacter.attack   ' PV';
        this.checkHealth (luffyCharacter);
    }
    specialAttack (luffyCharacter){
        (luffyCharacter.health -= narutoCharacter.attack * 3);
        this.levelUp ();
        popUp.style.display = 'inline';
        popUp.innerText = narutoCharacter.name   ' utilise son Rasengan sur '   luffyCharacter.name   ' et lui enlève '   narutoCharacter.attack*3   ' PV';
        this.checkHealth (luffyCharacter);
    }
    heal (){
        narutoCharacter.health  = 9;
        popUp.style.display = 'inline';
        popUp.innerText = narutoCharacter.name   ' se soigne.';
    }
}   
class Pirate extends Character {
    constructor (name, type, health, attack, level){
        super (name, type, health, attack, level)
    }
    attackEnemy (narutoCharacter){
        narutoCharacter.health -= luffyCharacter.attack;
        this.levelUp ();
        popUp.style.display = 'inline';
        popUp.innerText = luffyCharacter.name   ' attaque '   narutoCharacter.name   ' et lui enlève '   luffyCharacter.attack   ' PV';
        this.checkHealth (narutoCharacter);
    }
    specialAttack (narutoCharacter){
        (narutoCharacter.health -= luffyCharacter.attack * 3);
        this.levelUp ();
        popUp.style.display = 'inline';
        popUp.innerText = luffyCharacter.name   ' utilise Red Hawk sur '   narutoCharacter.name   ' et lui enlève '   luffyCharacter.attack*3   ' PV';
        this.checkHealth (narutoCharacter);
    }
    heal (){
        this.health  = 10;
        popUp.style.display = 'inline';
        popUp.innerText = luffyCharacter.name   ' se soigne.';
    }
}
let luffyCharacter = new Ranger ("Luffy", "Ranger", 100, 8, 0);
let narutoCharacter = new Spy ("Naruto", "Spy", 110, 7, 0)

let attackSimpleNaruto = document.getElementById('attack-naruto-simple');
let attackSpecialNaruto = document.getElementById('attack-naruto-special');
let healNaruto = document.getElementById('naruto-heal');

let attackSimpleLuffy = document.getElementById('attack-luffy-simple');
let attackSpecialLuffy = document.getElementById('attack-luffy-special');
let healLuffy = document.getElementById('luffy-heal');

let luffyHp = document.getElementById ('luffy-hp');
let narutoHp = document.getElementById ('naruto-hp');

luffyHp.innerText = '100';
narutoHp.innerText = '110';

let luffyLevel = document.getElementById ('luffy-level');
let narutoLevel = document.getElementById ('naruto-level');

luffyLevel.innerText = '0';
narutoLevel.innerText = '0';

attackSimpleNaruto.addEventListener ('click', () => {
    narutoCharacter.attackEnemy(luffyCharacter);
    luffyHp.innerText = luffyCharacter.health;
    narutoLevel.innerText = narutoCharacter.level;
    luffyCharacter.informations;
})
attackSpecialNaruto.addEventListener ('click', () => {
    narutoCharacter.specialAttack(luffyCharacter);
    luffyHp.innerText = luffyCharacter.health;
    narutoLevel.innerText = narutoCharacter.level;
    luffyCharacter.informations;
})
healNaruto.addEventListener ('click', () => {
    narutoCharacter.heal();
    narutoCharacter.informations;
    narutoLevel.innerText = narutoCharacter.level;
    narutoHp.innerText = narutoCharacter.health;
})

attackSpecialLuffy.addEventListener ('click', () => {
    luffyCharacter.specialAttack(narutoCharacter);
    narutoHp.innerText = narutoCharacter.health;
    luffyLevel.innerText = luffyCharacter.level;
    narutoCharacter.informations;
})
healLuffy.addEventListener ('click', () => {
    luffyCharacter.heal();
    luffyHp.innerText = luffyCharacter.health;
    luffyLevel.innerText = luffyCharacter.level;
    luffyCharacter.informations;
})
attackSimpleLuffy.addEventListener ('click', () => {
    luffyCharacter.attackEnemy(narutoCharacter);
    narutoHp.innerText = narutoCharacter.health;
    luffyLevel.innerText = luffyCharacter.level;
    narutoCharacter.informations;
})

Thanks for trying to help me !

CodePudding user response：

luffyCharacter.attackEnemy(narutoCharacter);

when luffy(Ranger) attacks naruto, in Ranger.attackEnemy you, deal damage to naruto, but you check luffyCharacter health, why?

CodePudding user response：

something like that

class Character {
constructor (name,type,health,attack,level){
    this.name = name;
    this.type = type;
    this.health = health;
    this.attack = attack;
    this.level = level;
}
levelUp (){
    this.level  ;
    popUp.style.display = 'inline';
    popUp.innerText = this.name  ' passe au niveau '  this.level;
}
checkHealth (){ 
    if (this.health <=0){
        this.health = 0;
        popUp.style.display = 'inline';
        popUp.innerText = this.name  ' est mort.'
    } else {
        console.log ('Toto');
    }
}
get informations (){
    infoPopUp.innerText = this.name   ' '   this.type   ' a '   this.health 
  ' hp et est au niveau '  this.level;
         tempMessage.style.display = 'inline';
    }
}

class Game{
    attack(source, target){
        target.health -= source.attack; 
        return target.checkHealth()
    }
}

var game = new Game();
var luffy = new Character('Luffi','spy',100, 5, 3);
var naruto = new Character('Naruto','ranger',120, 2, 5);

game.attack(naruto, luffy);

or you make Attack member of Charakter, then you have somethink like this:

class Character {
    ....
    checkHealth (){ 
        if (this.health <=0){
            this.health = 0;
            popUp.style.display = 'inline';
            popUp.innerText = this.name  ' est mort.'
        } else {
            console.log ('Toto');
        }
    }
   .....

   Attacke(target){
    target.health -= this.attack; 
    return target.checkHealth()
   }
}

luffi.Attack(naruto)

CodePudding user response：

Try making it so every time hp gets removed, that it does not result in negative hp. For example, if fox removes 10 hp from turtle (lets say he has 5hp) since his hp is less that zero, he is knocked out. You can do the same thing if the hp is zero. Just make sure to reset the hp to zero.