Как я могу сделать оператор if else в JavaScript, чтобы пользователь нажимал кнопку, чтобы продолжить оператор? - PullRequest
Новая
       6

Как я могу сделать оператор if else в JavaScript, чтобы пользователь нажимал кнопку, чтобы продолжить оператор?

0 голосов
/ 17 января 2020

Я построил небольшой проект игры и есть боевая система. Проблема в том, что если вы нажмете на атаку, она полностью выполнит оператор if else, но не покажет все. Это также дает мне ошибку «Нет номера», если вы проигрываете, и я не могу понять, что делать. Нужно ли менять порядок операторов или что-то в этом роде? 

setFightEvent: function() {
    let getArena = document.querySelector(".arena");  
    let getEnemy = document.querySelector(".enemy");
    let enemy00 = new Enemy("Goblin", 100, 0, 20, 50, 100, 100);
    let enemy01 = new Enemy("Troll", 200, 0, 40, 50, 80, 150);
    let chooseRandomEnemy= Math.floor(Math.random() * Math.floor(2));
    switch (chooseRandomEnemy) {
        case 0:
            enemy = enemy00;
            getArena.innerHTML = '<div><p>You are fighting a ' + enemy.enemyType + '<button class="btn-attack" onclick="EventManager.FightEvent()">Attack!</button></p></div>';
            break;
        case 1:
            enemy = enemy01;
            getArena.innerHTML = '<div><p>You are fighting a ' + enemy.enemyType + '<button class="btn-attack" onclick="EventManager.FightEvent()">Attack!</button></p></div>';
            break;
    }
    getEnemy.innerHTML = '<img src="img/avatar-enemy/' + enemy.enemyType.toLowerCase() + '.jpg" alt="' + enemy.enemyType + '" class="img-enemy"><div><h3 class="type-enemy">' + enemy.enemyType + '</h3><p class="health-enemy">Health: ' + enemy.health + '</p><p class="mana-enemy">Mana: ' + enemy.mana + '</P><p class="dexterity-enemy>Dexterity :' + enemy.dexterity + '</p></div>';
},
FightEvent: function() {
    let getEnemy = document.querySelector(".enemy");
    getEnemy.style.visibility = 'visible';
    let getArena = document.querySelector(".arena");
    let getPlayerHealth = document.querySelector(".health-player");
    let getEnemyHealth = document.querySelector(".health-enemy");
    let getPlayerGold = document.querySelector(".gold-player");
    let getPlayerDexterity = player.dexterity;
    let getEnemyDexterity = enemy.dexterity;
    let playerAttack = function () {
        let calcBaseDamage;
        if (player.mana > 0) {
            calcBaseDamage = player.strength * player.mana / 1000;
        } else {
            calcBaseDamage = player.strength * player.dexterity / 1000;
        }
        let offsetDamage = Math.floor(Math.random() * Math.floor(10));
        let calcOutputDamager = calcBaseDamage + offsetDamage;
        let numberOfHits = Math.floor(Math.random() * Math.floor(player.dexterity / 6) / 2) + 1 ;
        let attackValues = [calcOutputDamager, numberOfHits];
        return attackValues;
    }
    let enemyAttack = function () {
        let calcBaseDamage;
        if (enemy.mana > 0) {
            calcBaseDamage = enemy.strength * enemy.mana / 1000;
        } else {
            calcBaseDamage = enemy.strength * enemy.dexterity / 1000;
        }
        let offsetDamage = Math.floor(Math.random() * Math.floor(6))
        let calcOutputDamager = calcBaseDamage + offsetDamage;
        let numberOfHits = Math.floor(Math.random * Math.floor(enemy.dexterity / 6) / 2) + 1 ;
        let attackValues = [calcOutputDamager, numberOfHits];
        return attackValues;
    }
    if (getPlayerDexterity >= getEnemyDexterity) {
        let PlayerAttackValues = playerAttack();
        let totalDamage = PlayerAttackValues[0] * PlayerAttackValues[1];
        enemy.health = enemy.health - totalDamage;
        getArena.innerHTML = '<div><p>You hit the ' + enemy.enemyType + ' for ' + PlayerAttackValues[0] + ' damage ' + PlayerAttackValues[1] + ' times!</p></div>';
        if (enemy.health <= 0) {
            player.gold = player.gold + enemy.gold;
            player.xp = player.xp + enemy.xp;
            getArena.innerHTML = '<div<p>After a hard fought battle, you won. You also looted the ' + enemy.enemyType + ' and it had ' + enemy.gold + ' gold!<br>Gained ' + enemy.xp + ' XP!</p></div>';
            getPlayerGold.innerHTML = 'Gold: ' + player.gold;
            getPlayerHealth.innerHTML = 'Health: ' + player.health;
            getEnemyHealth.innerHTML = 'Health: 0';
         } else {
            let enemyAttackValues = enemyAttack();
            let totalDamage = enemyAttackValues[0] * enemyAttackValues[1];
            player.health = player.health - totalDamage;
            getArena.innerHTML = '<div><p>The ' + enemy.enemyType + ' hit you for ' + enemyAttackValues[0] + ' damage ' + enemyAttackValues[1] + ' times!</p></div>';
            getEnemyHealth.innerHTML = 'Health: ' + enemy.health;
            getPlayerHealth.innerHTML = 'Health: ' + player.health;
            if (player.health <= 0) {
                player.xp = player.xp + (enemy.xp / 2);
                getArena.innerHTML ='<div><p>After a gruelling battle, you lost. Maybe you should rest before fighting again.<br>Gained ' + enemy.xp + '!'
                getPlayerHealth.innerHTML = 'Health: 0';
                getEnemyHealth.innerHTML = 'Health: ' + enemy.health;
            } else {
                getPlayerHealth.innerHTML = 'Health: ' + player.health;
            }
         } 
        } else if (getEnemyDexterity >= getPlayerDexterity) {
            let enemyAttackValues = enemyAttack();
            let totalDamage = enemyAttackValues[0] * enemyAttackValues[1];
            player.health = player.health - totalDamage;
            getArena.innerHTML = '<div><p>The ' + enemy.enemyType + 'hit you for ' + enemyAttackValues[0] + ' damage ' + enemyAttackValues[1] + ' times!</p></div>';
            if (player.health <= 0) {
                player.xp = player.xp + (enemy.xp / 2);
                getArena.innerHTML ='<div><p>After a gruelling battle, you lost. Maybe you should rest before fighting again.<br>Gained ' + enemy.xp + '!'
                getPlayerHealth.innerHTML = 'Health: 0';
                getEnemyHealth.innerHTML = 'Health: ' + enemy.health; 
        } else {
            let PlayerAttackValues = playerAttack();
            let totalDamage = PlayerAttackValues[0] * PlayerAttackValues[1];
            enemy.health = enemy.health - totalDamage;
            getArena.innerHTML = '<div><p>You hit the ' + enemy.enemyType + ' for ' + PlayerAttackValues[0] + ' damage ' + PlayerAttackValues[1] + ' times!</p></div>';
            getPlayerHealth.innerHTML = 'Health: ' + player.health;
            if (enemy.health <= 0) {
                player.gold = player.gold + enemy.gold;
                player.xp = player.xp + enemy.xp;
                getArena.innerHTML = '<div<p>After a hard fought battle, you won. You also looted the ' + enemy.enemyType + ' and it had ' + enemy.gold + ' gold!<br>Gained ' + enemy.xp + ' XP!</p></div>';
                getPlayerGold.innerHTML = 'Gold: ' + player.gold;
                getPlayerHealth.innerHTML = 'Health: ' + player.health;
                getEnemyHealth.innerHTML = 'Health: 0';
                alert("Select another action before fighting again!");
            } else {
                getEnemyHealth.innerHTML = 'Health: ' + enemy.health;
            }

         }
        }



        },

кажется, что код работает нормально, если вы не собираетесь проигрывать, тогда он просто ломается. Я хочу быть в состоянии сказать первое, если еще, а затем попросить пользователя нажать кнопку, прежде чем она продолжится. Например, если вы не убьете их одним ударом, я бы хотел, чтобы он показал обновленное здоровье игрока и монстра, ТО затем снова запустите оператор if else. Я думаю, что проблема в том, что если вы не ОТКРЫТЬ их, он просто умрет. Надеюсь это имеет смысл! пс. https://squarecylinder.github.io/Stress-of-The-Kingdom/ здесь ссылка на игру, но я использовал абсолютное позиционирование в CSS, чтобы выровнять все, поэтому я не думаю, что это будет выглядеть правильно на каждом дисплее! Я тоже пытаюсь это понять!

1 Ответ

0 голосов
/ 17 января 2020

В комментариях уже упоминается тот факт, что вы указываете Math.random вместо вызова Math.random() в одном месте вашего кода, поэтому я оставлю это в покое. Кроме этого, эта строка не имеет точки с запятой в конце: 

getArena.innerHTML = '<div><p>After a gruelling battle, you lost. Maybe you should rest before fighting again.<br>Gained ' + enemy.xp + '!'

Это происходит дважды в коде. Я не настроил работающий образец кода, поэтому я не знаю, является ли это вашей единственной оставшейся проблемой. Если после обновления это не помогло, сообщите мне, и я удалю этот ответ.

Примечание:

Ваши случайные утверждения немного излишне сложны. Например, с этой строкой: 

Math.floor(Math.random() * Math.floor(10))

нет необходимости floor 10. 10 уже является плоским целым числом. Фактически, поскольку вы используете много случайностей, я бы использовал rando js .com , чтобы сделать вашу случайность проще и удобочитаемее. Строку выше можно записать как rando(0, 9). Если вы решите использовать rando js, все, что вам нужно сделать, это добавить следующую строку в заголовок вашего документа html: 

<script src="https://randojs.com/1.0.0.js"></script>
...