Почему мой оператор && не работает в созданном мной файтинге?

Question

Я потратил последние 3 часа, пытаясь заставить этот код работать. Если ваш HP равен нулю, я хочу, чтобы всплывало предупреждение с надписью «Вы проиграли!» Если HP врага равно нулю, предупреждение должно сказать «Вы выиграли!». Если оба равны нулю, то он должен сказать: «Это ничья!».

Я напортачил, пытаясь превратить «если» в «!». и, вероятно, поменяли порядок if примерно 50 раз. Однажды у меня это было полностью правильно, но это было тогда, когда у меня было HP начиная с 10, а случайное значение - только * 3. Как только я обновился до 100 и * 50, розыгрыш снова начал не работать.

Если кто-нибудь может помочь, это было бы здорово !!

let yourHp = 100;
let enemyHp = 100;

function attack() {
    let attack = 100;
    //Math.floor(Math.random() * 50);
    let enemyAttack = 50;
    //Math.floor(Math.random() * 50);

    if (!(enemyHp <= 0)) {
        //how much you attack for
        enemyHp -= attack;

        //setting enemy Hp minus how much your attack was
        enemyHpp(enemyHp);

        //setting how much you attacked for
        damage(attack);

        //If both you and the enemy are at 0, it's a draw
    }
    if (!enemyHp >= 0 && !yourHp > 0) {
        enemyHp = 0;
        yourHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert("It's a draw!");
        }, 1);
        document.location.reload();
    } else if (!(enemyHp >= 0)) {
        //If enemy is at 0, you win
        enemyHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert('You win!');
        }, 1);
        document.location.reload();
    }

    //how much enemy attacks for
    yourHp -= enemyAttack;

    //setting your Hp minus how much enemy attack was
    yourHpp(yourHp);

    //setting how much enemy attacked for
    enemyDamage(enemyAttack);

    if (!(yourHp >= 0)) {
        //If only you are at 0, you lose
        yourHp = 0;
        yourHpp(yourHp);
        enemyHpp(enemyHp);
        setTimeout(function() {
            alert('You lose!');
        }, 1);
        document.location.reload();
    }
}

//Making the outputs show in the body
function damage(msg) {
    document.getElementById('damage').innerHTML = msg;
}

function enemyHpp(msg) {
    document.getElementById('enemyHp').innerHTML = msg;
}

function enemyDamage(msg) {
    document.getElementById('enemyDamage').innerHTML = msg;
}

function yourHpp(msg) {
    document.getElementById('yourHp').innerHTML = msg;
}

Я переключил код на следующий за ответ, и код по-прежнему показывает ничью как выигрыш "я" ...

if (enemyHp <= 0 && yourHp <= 0) {
        enemyHp = 0;
        yourHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert("It's a draw!");
        }, 1);
        document.location.reload();
    } else if (enemyHp <= 0) {
        //If enemy is at 0, you win
        enemyHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert('You win!');
        }, 1);
        document.location.reload();
    } else if (yourHp <= 0) {
        //If only you are at 0, you lose
        yourHp = 0;
        yourHpp(yourHp);
        enemyHpp(enemyHp);
        setTimeout(function() {
            alert('You lose!');
        }, 1);
        document.location.reload();
    }

Answer 1

Этот оператор:

if (!enemyHp >= 0 && !yourHp > 0) {

нуждается в дополнительных скобках, чтобы делать то, что вы хотите. На самом деле это означает:

if ((!enemyHp) >= 0 && (!yourHp) >= 0))

Что, похоже, не соответствует тому, что вы описываете предполагаемому поведению.

Вероятно, вы хотите:

if ((enemyHp <= 0) && (yourHp <= 0)) {
     // draw
} else if (enemyHp <= 0) {
     // win
} else if (yourHp <= 0) {
     // lose
}

Answer 2

Использование точки останова в Chrome (спасибо за предложение KaeyangTheG !!), это действительно помогло. Рабочий код:

let yourHp = 100;
let enemyHp = 100;

function attack() {
    let attack = Math.floor(Math.random() * 50);
    let enemyAttack = Math.floor(Math.random() * 50);

    if (enemyHp >= 0) {
        //how much you attack for
        enemyHp -= attack;

        //setting enemy Hp minus how much your attack was
        enemyHpp(enemyHp);

        //setting how much you attacked for
        damage(attack);

        //If both you and the enemy are at 0, it's a draw
    }
    //how much enemy attacks for
    yourHp -= enemyAttack;

    //setting your Hp minus how much enemy attack was
    yourHpp(yourHp);

    //setting how much enemy attacked for
    enemyDamage(enemyAttack);

    if (enemyHp <= 0 && yourHp <= 0) {
        enemyHp = 0;
        yourHp = 0;
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert("It's a draw!");
        }, 1);
        document.location.reload();
    } else if (enemyHp <= 0) {
        //If enemy is at 0, you win
        enemyHp = 0;
        console.log(enemyHp);
        console.log(yourHp);
        enemyHpp(enemyHp);
        yourHpp(yourHp);
        setTimeout(function() {
            alert('You win!');
        }, 1);
        document.location.reload();
    } else if (yourHp <= 0) {
        //If only you are at 0, you lose
        yourHp = 0;
        yourHpp(yourHp);
        enemyHpp(enemyHp);
        setTimeout(function() {
            alert('You lose!');
        }, 1);
        document.location.reload();
    }
}

//Making the outputs show in the body
function damage(msg) {
    document.getElementById('damage').innerHTML = msg;
}

function enemyHpp(msg) {
    document.getElementById('enemyHp').innerHTML = msg;
}

function enemyDamage(msg) {
    document.getElementById('enemyDamage').innerHTML = msg;
}

function yourHpp(msg) {
    document.getElementById('yourHp').innerHTML = msg;
}