개발자노트/웹

HTML 업다운게임 예제 ( HTML형변환 예제 )

hansummer 2022. 7. 25. 17:18

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>업다운 -2</title>
</head>
<body>
<script type="text/javascript">
	var ans=Math.floor(Math.random()*100)+1; // 00~99 -> 1~100 , 소숫점때문에 floor 사용
		//floor() 함수는 주어진 숫자와 같거나 작은 정수 중에서 가장 큰 수를 반환
	var cnt=0; // 정답을 맞추기 까지의 횟수
	var L=1; // 최소값
	var H=100; // 최대값
	
	while(true){
		var input=prompt(L+'~'+H+' 사이의 숫자를 입력하세요.');
		cnt++;
		if(input==ans){
			var msg='총'+cnt+'번 만에 정답을 맞추셨습니다!';
			document.write(msg);
			break;
		}
		else if(input>ans){
			alert('다운!');
			H=Number(input)-1; // 자동 형변환
		}
		else{
			alert('업!');
			L=Number(input)+1 ; // 사용자가 prompt()를 통해 입력한 값은 [문자열!]
		}
	}

</script>

</body>
</html>

전에 올린 up-down과 유사하지만, 여기서 주의할 점은 사용자가 prompt()를 통해 입력한 값은 [문자열]로 취급되기 때문에

Numner(input)으로 형변환하여 계산하게 하였다.

 

 

다른 풀이 ( 약간의 유효성 검사 )

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>업다운</title>
</head>
<body>

<script type="text/javascript">
	var min = 1; // 최소값
	var max = 100; // 최대값
	var ans = Math.floor(Math.random() * (max-min)+min);  // 최소값, 최대값을 수정할 경우를 위해
	var cnt = 0; // 정답을 맞추기까지의 입력횟수
	while(true){
		var input = prompt(min+ "과" +max+ "사이에 정답 존재")
		input = Number(input);
		if(ans>input){
			alert('업!');
			if(min>input){
				cnt++;
				continue;
			}
			min = input;
		}
		else if(ans<input){
			alert('다운!');
			if(max<input){
				cnt++;
				continue;
			}
			max = input;
		}
		else if (ans==input){
			alert(cnt+"번 만에 맞추셨습니다.")
			break;
		}
		if (min>max){ // 예전에 배웠던 tmp를 사용
			var tmp =0;
			tmp = min;
			min = max;
			max = tmp;
		}
		cnt++;
	}
	
</script>

</body>
</html>

예전에 학습했던 tmp를 사용하여 최대값과 최소값이 cross 되지 않도록 설정하여

입력값에 따라 min max 가 변하지 않도록 유효성 검사를 추가

 

 

수행결과