본문 바로가기
Front/JavaScript

[JavaScript] 조건문(if문, if~else문, 다중 if~else문, switch~case문)

by 시월해 2021. 4. 23. 
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	// 자바스크립트에서의 제어문 종류
	// 1. 조건문 : if문, if~else문, 다중 if~else문, switch~case문
	// 2. 반복문 : while문, do~while문, for문
	
	let walk = Number(prompt("내가 하루에 걷는 걸음은 몇 걸음인가요?")); 
	
	if(walk >= 10000) {
		document.write(typeof walk+"<br>");
		document.write("당신은 매우 좋은 습관을 가지고 있습니다.");
	}
	
	document.write("<hr>");
	
	let name = prompt("방문자의이름은???");
	
	// 조건식에 0, null, "" ==> false
	if(name) {
		document.write(name + "님 환영합니다.");
	}
</script>
</head>
<body>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">

	// if~else 조건문
	// 형식) if(조건식) {
	//			참인 경우 실행문;
	//      }else {
	//          거짓인 경우 실행문;	
	//      }
	
	let walk = parseInt(prompt("당신이 하루에 걷는 걸음은 몇 걸음인가요?"));
	
	if(walk >= 10000) {
		document.write("좋은 습관을 가지고 있습니다.<br>");
	}else {
		document.write("운동을 하셔야 겠군요...<br>");
	}

	let result = confirm("정말 탈퇴하시겠습니까?");
	
	if(result) {
		document.write("탈퇴 처리하였습니다.");
	}else {
		document.write("탈퇴 취소 처리하였습니다.");
	}
	
</script>
</head>
<body>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">

	// [문제] 키보드를 이용하여 사용자 아아디와 사용자 비밀번호를 입력받아서
	//       입력 받은 사용자 아이디가 "hong"이고 입력받은 비밀번호가 "1234"
	//       이면 "환영합니다." 라는 메세지를 화면에 출력해 보세요.

	let userId = prompt("사용자 아이디를 입력하세요.");
	let userPwd = prompt("사용자 비밀번호를 입력하세요.");
	
	// 첫번째 방법
	// if(userId == "hong" && userPwd == "1234") {
	// 	document.write("환영합니다.<br>");
	// }
	
	// 두번째 방법
	if(userId == "hong") {
		if(userPwd == "1234") {
			document.write("환영합니다.<br>");
		}else {
			document.write("비밀번호가 틀립니다. 확인해 주세요..<br>");
		}
	}else {  // 아이디가 "hong" 이 아니거나 회원이 아닌 경우
		document.write("아이디를 확인하거나 회원가입을 해 주세요..");
	}
	
	
</script>
</head>
<body>

</body>
</html>

toFixed() : 숫자에서 원하는 소숫점 길이만큼만 반올림까지 해서 출력해 주는 함수.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">

	// 다중 if~else문
	
	// 키보드로 이름, 국어, 영어, 수학 점수를 입력을 받자.
	let name = prompt("이름을 입력하세요.");
	let kor = parseInt(prompt("국어점수를 입력하세요."));
	let eng = parseInt(prompt("영어점수를 입력하세요."));
	let mat = parseInt(prompt("수학점수를 입력하세요."));
	
	// 총점을 구하자.
	let sum = kor + eng + mat;
	
	// 평균을 구하자.
	let avg = sum / 3.0;
	
	// 학점을 구하자.
	let grade;
	
	if(avg >= 90) {
		grade = "A학점";
	}else if(avg >= 80) {
		grade = "B학점";
	}else if(avg >= 70) {
		grade = "C학점";
	}else if(avg >= 60) {
		grade = "D학점";
	}else {
		grade = "F학점";
	}
	
	// 성적을 화면에 출력해 보자.
	// toFixed() : 숫자에서 원하는 소숫점 길이만큼만 반올림까지 해서 출력해 주는 함수.
	document.write("이  름 : "+name+"<br>");
	document.write("국어점수 : "+kor+"점<br>");
	document.write("영어점수 : "+eng+"점<br>");
	document.write("수학점수 : "+mat+"점<br>");
	document.write("총  점 : "+sum+"점<br>");
	document.write("평  균 : "+avg.toFixed(2)+"점<br>");
	document.write("학  점 : "+ grade+"<br>");

</script>
</head>
<body>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">

	// switch~case문
	// 다중 if~else문을 switch~case문으로 변경할 수 있는 경우는
	// if문 중 조건식이 특정한 값과 일치되는 경우(==)만 switch~case문을
	// 사용할 수 있음.
	// 즉, 조건식에 ==인 경우를 제외하고 >=, >, <=, <, != 과 같은
	// 비교연산자를 사용한 경우에는 switch~case문으로 변경할 수 없음.

	let site = 
			prompt("네이버, 다음, 구글 중 자주 사용하는 포털 사이트는???");
	
	let url;
	
	switch(site) {
		case "네이버" :
			url = "www.naver.com";
			break;
		case "다음" :
			url = "www.daum.net";
			break;
		case "구글" :
			url = "www.google.com";
			break;
		default :
			alert("보기 중에는 없는 사이트입니다.");
	}
	
	if(url) {
		location.href="http://"+url;  // 페이지로 이동이 진행됨.
	}else {
		location.reload();   // 현재 페이지를 새로 고침.
	}
	
</script>
</head>
<body>

</body>
</html>

Math.random(): 0에서 1사이의 랜덤 숫자를 발생시키는 함수

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">

	// 난수를 발생시켜서 추첨을 통해서 경품을 받게 해 보자.
	// 요구사항
	// 1부터 10 사이의 숫자를 랜덤하게 뽑아 보자.
	// 3번 - 냉장고 당첨  /  5번 - 세탁기 당첨  /  8번이면 TV 당첨.
	// 그 이외의 번호는 꽝!!!
	
	// Math.random() 함수는 0에서부터 1 사이의 랜덤 숫자를 발생시키는 함수.
	// Math.random() * 10 을 곱하면 0부터 9까지의 랜덤한 숫자를 구할 수 있음.
	// 대신에 정수값이 아닌 실수로 나오기 때문에 parseInt() 함수를 이용하여
	// 정수로 형변환을 해 주면 됨. 이 값에 1을 더해 주면 1부터 10까지의 난수를 
	// 받을 수 있게 됨.
	let luckyNo = parseInt(Math.random() * 10) + 1;
	
	switch(luckyNo) {
		case 3 :
			document.write("냉장고에 담첨이 되었습니다.<br>");
			break;
		case 5 :
			document.write("세탁기에 담첨이 되었습니다.<br>");
			break;
		case 8 :
			document.write("TV에 담첨이 되었습니다.<br>");
			break;
		default : 
			document.write(luckyNo +"가 나왔네요...<br>");
			document.write("꽝입니다.~~~");
	}

</script>
</head>
<body>

</body>
</html>

 

저작자표시

'Front > JavaScript' 카테고리의 다른 글

[JavaScript] 배열(Array)  (0) 2021.04.23
[JavaScript] 반복문(while문, for문)  (0) 2021.04.23
[JavaScript] 논리 연산자, 단항(증감) 연산자, 삼항 연산자  (0) 2021.04.23
[JavaScript] 기본 개념  (0) 2021.04.22
[JavaScript] 관계 연산자  (0) 2021.04.22

관련글

티스토리툴바