본문 바로가기

CS Study/Javascript

2. 조건문 / 반복문

1. 학점 매기기 - if-else

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>if-else</title>
</head>
<body>
	<h1>if-else를 이용한 학점 매기기</h1>
	<hr>
	<script>
		let grade;
		let score = prompt("최진우님 점수를 입력하세요",100);
		score = parseInt(score);
		if(score>=90){
			grade = "A";
		}
		else if(score>=80&&score<90){
			grade = "B";
		}
		else if(score>=70&&score<80){
			grade = "C";
		}
		else if(score>=60&&score<70){
			grade = "D";
		}
		else{
			grade = "E";
		}
		document.write(score + "는 "+grade+"입니다.");
	</script>

</body>
</html>

2. 커피 주문하기 - switch

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>switch</title>
</head>
<body>
	<h1>switch 문으로 커피주문</h1>
	<hr>
	<script>
		let price =0;
		let order = prompt("무슨 커피 드릴까요?","coffee");
		switch(order){
			case "espresso":
			case "에스프레소" :
				price =2000;
					break;
			case "카페라떼" : 
				price = 3000;
				break;
			case "아메리카노" : 
				price = 1500;
				break;
			default : document.write("그런 메뉴는 없어용~<br>");
		}
		if(price!=0){
			document.write("가격은 " + price + "입니다");
		}
	</script>

</body>
</html>

3. 다양한 크기의 글씨 출력 - for

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>for 문</title>
</head>
<body>
	<h1>for 문으로 10px~35px 크기 출력</h1>
	<hr>
	<script>
		for(let size = 10; size<=35; size+=5){
			document.write("<span style = 'font-size : "+size+"px'>" + size+"px</span>");
		}
	</script>

</body>
</html>

4. 0~n까지의 합 구하기 - while

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>while 문</title>
</head>
<body>
	<h1>while 문으로 0에서 n까지 합</h1>
	<hr>
	<script>
		let n = prompt("0보다 큰 정수를 입력하세요",0);
		n = parseInt(n);
		let i=0;
		let sum = 0;
		do{
			sum+=i;
			i++;
		}while(i<=n)
		document.write("0에서 "+n+"까지의 합은 "+sum);
	</script>

</body>
</html>

5. 1에서 얼마까지 더해야 3000을 넘는가 확인 - break

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>break 문</title>
</head>
<body>
	<h1>1에서 얼마까지 더해야 3000을 넘는가?</h1>
	<hr>
	<script>
		let n= 0;
		let sum = 0;
		while(true){
			sum+=n;
			if(sum>3000){
				break;
			}
			n++;
		}
		document.write(n+"까지 더하면 3000을 넘음 : "+sum);
	</script>

</body>
</html>

6. 3으로 나눈 수가 1인 수만 더하기

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>continue 문</title>
</head>
<body>
	<h1>3으로 나눈 나머지가 1인 수만 더하기</h1>
	<hr>
	<script>
		let sum = 0;
		for(let i=1;i<=10;i++){
			if(i%3!=1){
				continue;
			}
			sum+=i;
			document.write(i + " ");
		}
		document.write("합은 " + sum);
	</script>

</body>
</html>

7. 출근 요일 출력하기 - switch

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>월화수목금토일</title>
</head>
<body>
	<h1>월화수목금토일</h1>
	<hr>
	<script>
		let day = prompt("월화수목금토일 중에서 입력하세요.");
		switch(day){
			case "월": document.write(day + "요일은 출근"); break;
			case "화": document.write(day + "요일은 출근"); break;
			case "수": document.write(day + "요일은 출근"); break;
			case "목": document.write(day + "요일은 출근"); break;
			case "금" : 
			case "토" : 
			case "일" : document.write("휴일"); break;
		}
	</script>


</body>
</html>

8. 암호 입력 - do-while, break

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>do-while과 break</title>
</head>
<body>
	<h1>암호를 입력하라</h1>
	<hr>
	<script>
		let password;
		do{
			password = prompt("암호를 대라");
		}while(password != "you");
		document.write("통과");

	</script>

</body>
</html>

 

'CS Study > Javascript' 카테고리의 다른 글

6. 이벤트 객체 (1) - 마우스 핸들링  (0) 2022.04.08
5. DOM / document 객체  (0) 2022.04.08
4. 배열과 객체  (0) 2022.04.08
3. 함수  (0) 2022.04.08
1. 데이터 타입과 변수 / 연산  (0) 2022.04.08