JavaScript のコードを使用して、入金、出金、残高確認、および出金の機能を備えた ATM の効果を実現します。

まずは効果を見てみましょう

Video_2022-08-01_214421

目次

        最初: ステップ 1: フレームワークを構築する

        2 番目のステップ: 分析、ユーザーが実行した操作、入金または引き出しなどを知るにはどうすればよいので、最初のステップでは、入力した操作をプログラムに知らせる必要があります。

        ステップ 3: 変数を追加する

        ステップ 4: 初期バランスを与える変数を追加します

        ステップ 5: 判定条件の追加を開始する

                        1. 入金条件

                          1. 条件を追加する 

                          2. 条件を追加する

                       2. 退会条件

                         1.退会条件の追加

                         3.残高を確認する

                       4.終了

                        5.forループの簡単な説明


今すぐコードデモ

        最初: ステップ 1: フレームワークを構築する

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
		


		</script>
	</body>
</html>

        2 番目のステップ: 分析、ユーザーが実行した操作、入金または引き出しなどを知るにはどうすればよいので、最初のステップでは、入力した操作をプログラムに知らせる必要があります。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
		
		





		</script>
	</body>
</html>

ここに '\n' を追加して、改行を有効にします

        ステップ 3: 変数を追加する

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			








		</script>
	</body>
</html>

         ステップ 4: 初期バランスを与える変数を追加します

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			






		</script>
	</body>
</html>

ステップ 5: 判定条件の追加を開始する

                1. 入金条件

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			for (var i = sum; i <=i; i++) {
				if (sum == 1) {
					
				}







	
		</script>
	</body>
</html>

         ここでは if を使用して、ユーザーが入金したときにプログラムが対応する操作を実行すると判断します。

                                1. 条件を追加する 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			for (var i = sum; i <= i; i++) {
				if (sum == 1) {
					var money = prompt('请输入你想存入的金额')
					money = Number(money);
					
				}








		</script>
	</body>
</html>

ここでは、ユーザーが入金したときに変数を定義し、ユーザーが入金した金額の入力ボックスをポップアップ表示し、データ型を変換することを忘れないように記述します。 

                                        2. 条件を追加する

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			for (var i = sum; i <= i; i++) {
				if (sum == 1) {
					var money = prompt('请输入你想存入的金额')
					money = Number(money);
					ck += money;
					alert('你的余额为' + ck)

				} 
		</script>
	</body>
</html>

この場合、ここまで入金の手順を書いてきました。次に、引き出しを書きます

        2. 退会条件

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			for (var i = sum; i <= i; i++) {
				if (sum == 1) {
					var money = prompt('请输入你想存入的金额')
					money = Number(money);
					ck += money;
					alert('你的余额为' + ck)

				} else if (sum == 2) {
					var moneytwo = prompt('请输入你想取出的金额');
					moneytwo = Number(moneytwo)
					
				}
		</script>
	</body>
</html>

 同様に、ユーザーが引き出し操作を行うと、プログラムがそれを認識した後、ユーザーが引き出し金額を入力するための変数を定義し、現在の残高から引き出し額を差し引いて出力します

                                      1.退会条件の追加

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			for (var i = sum; i <= 999; i++) {
				if (sum == 1) {
					var money = prompt('请输入你想存入的金额')
					money = Number(money);
					ck += money;
					alert('你的余额为' + ck)

				} else if (sum == 2) {
					var moneytwo = prompt('请输入你想取出的金额');
					moneytwo = Number(moneytwo)
					ck = ck - moneytwo;
					alert('你的余额为' + ck);

				} 
		</script>
	</body>
</html>

 3.残高を確認する

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			for (var i = sum; i <= 999; i++) {
				if (sum == 1) {
					var money = prompt('请输入你想存入的金额')
					money = Number(money);
					ck += money;
					alert('你的余额为' + ck)

				} else if (sum == 2) {
					var moneytwo = prompt('请输入你想取出的金额');
					moneytwo = Number(moneytwo)
					ck = ck - moneytwo;
					alert('你的余额为' + ck);

				} else if (sum == 3) {
					alert('你的余额为' + ck);

				}
		</script>
	</body>
</html>

残高を確認するのは非常に簡単で、変数 ck を直接出力するだけです。

       4.終了

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			for (var i = sum; i <= 999; i++) {
				if (sum == 1) {
					var money = prompt('请输入你想存入的金额')
					money = Number(money);
					ck += money;
					alert('你的余额为' + ck)

				} else if (sum == 2) {
					var moneytwo = prompt('请输入你想取出的金额');
					moneytwo = Number(moneytwo)
					ck = ck - moneytwo;
					alert('你的余额为' + ck);

				} else if (sum == 3) {
					alert('你的余额为' + ck);

				} else if (sum == 4) {
					break;
				} else {
					alert('暂无此项业务');

				}
			
			}









		
		</script>
	</body>
</html>

 終了したい場合は、ここで前述した break キーワードを使用して、ループを終了させる必要があります

5. for ループの簡単な説明

ここで最初に for ループを使いました. 効果としては繰り返し実行されます. if だけであれば, ユーザーが操作を行った後, プログラムは終了し, ユーザーが更新した後にデータがリセットされるので,というのは無意味なので、ループの性質を利用して繰り返し実行する必要がありますが、なぜi<=iなのかというと、iはユーザーが入力した数値であるsumに等しいので、結果はいつでも true ですが、if の最後に 1 つ追加する必要があります。ユーザーが操作を続行できるようにするコード。そうしないと、i++ によるバグが発生します。 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0 ,user-scalable=0">
		<title></title>
	</head>
	<body>
		<script>
			var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			var a1 = 1;
			var a2 = 2;
			var a3 = 3;
			var a4 = 4;
			var ck = 100000;
			for (var i = sum; i <= 999; i++) {
				if (sum == 1) {
					var money = prompt('请输入你想存入的金额')
					money = Number(money);
					ck += money;
					alert('你的余额为' + ck)

				} else if (sum == 2) {
					var moneytwo = prompt('请输入你想取出的金额');
					moneytwo = Number(moneytwo)
					ck = ck - moneytwo;
					alert('你的余额为' + ck);

				} else if (sum == 3) {
					alert('你的余额为' + ck);

				} else if (sum == 4) {
					break;
				} else {
					alert('暂无此项业务');

				}
				var sum = prompt('请输入你想进行的操作' + '\n' + '1.存款' + '\n' + '2.取钱' + '\n' + '3.显示余额' + '\n' + '4.退出') * 1
			}









		</script>
	</body>
</html>

 この場合、ビデオのエフェクトはすべて完了しています.多くの方法があります.whileを使用することもできます.必要な場合は、プライベートメッセージを送信できます.

おすすめ

転載: blog.csdn.net/tea_tea_/article/details/126111224