Web front-end, ATM cash machine case based on JS

foreword

In the summary output of continuous learning, what I share today is the case of the ATM cash machine based on the Web front-end and JS

need

Users can choose to deposit money, withdraw money, check the balance and exit functions when withdrawing money at the ATM

analyze

1. When looping, the input box needs to be prompted repeatedly, so the prompt box must be written in the loop.
2. The exit condition is that the user enters 4. If it is 4, the loop will end and no pop-up window will appear.
3. Prepare to store a Amount, the default is 0, the amount is a variable and needs to be written outside
4, depositing money is an addition operation, withdrawing money is a subtraction operation, and checking the balance is directly displaying the
amount operation

Reference Code

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ATM取款机案例</title>
</head>
<body>
    <script>
        // 1. 不断的弹出对话框
        // 3. 金额的变量
        let money = 0
        while (true) {
      
      
            let str = prompt(`
            请您选择操作:
                1. 存钱
                2. 取钱
                3. 查看余额
                4. 退出
            `)
            // 2. 除非输入的是4 退出循环  break
            if (str === '4') {
      
      
                break
            }

            // 4. switch 加减操作
            switch (str) {
      
      
                case '1':
                    let cun = +prompt('请您输入存钱的金额:')
                    // money = money + cun 
                    money += cun
                    break
                case '2':
                    let qu = +prompt('请您输入取钱的金额:')
                    money -= qu
                    break
                case '3':
                    alert(`您卡上的余额是${ 
        money}元`)
                    break
            }
        }
    </script>
</body>

</html>

operation result:
Please add a picture description

insert image description here

insert image description here

Finally share a sentence:

There is no redemption in time. You cannot escape from the future. Presence is the key to freedom. Therefore, you can only be free in the present moment.
"The Power of Now"

That's all for this sharing! ! !

Welcome to leave a message to discuss in the comment area! !