성적표 만들기
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>01_성적표.html</title>
</head>
<body>
<h3>성적표</h3>
<div id="demo"></div>
<script>
let name = "손흥민";
let kor = 100, eng = 100, mat = 35;
let total = kor + eng + mat; //총점구하기
let aver = total / 3; //평균구하기
/*
-----------------------------
이름 손흥민
-----------------------------
국어 100
-----------------------------
영어 100
-----------------------------
수학 95
-----------------------------
총점 235
-----------------------------
평균 98
-----------------------------
A학점 문1) 평균 90이상 A, 80이상 B, 70이상 C, 60점이상 D, 나머지 F ~~
결과 합격 문2) 과락(합격, 재시험, 탈락) 한과목이라도 40미만이면 재시험
★★★★★★★★★ 문3)평균 10점당 한개씩
장학생 문4) 평균 95이상이면 장학생
----------------------------
*/
// 학점 구하기
// let grade = "";
// if (aver>=90) {
// grade = "A학점";
// } else if (aver>=80) {
// grade = "B학점";
// } else if (aver>=70) {
// grade = "C학점";
// } else if (aver>=60) {
// grade = "D학점";
// } else {
// grade = "F학점";
// }
// document.write(grade);
// switch case 이용
let grade="";
switch(parseInt(aver/10)) {
case 10 :
case 9 : grade="A학점"; break;
case 8 : grade="B학점"; break;
case 7 : grade="C학점"; break;
case 6 : grade="D학점"; break;
default : grade="F학점"; break;
}//switch
///////////////////////////////////////////////////
// 합격 여부
// let pnp = "";
// if (aver>=70) {
// if (kor<40 || eng<40 || mat<40) {
// pnp = "재시험";
// } else {
// pnp = "합격";
// }
// } else {
// pnp = "탈락";
// }
// document.write(pnp);
//
let pass="";
if (aver>=70) {
if(kor<40 || eng<40 || mat<40) {
pass="재시험";
} else {
pass="합격";
}
} else {
pass="탈락";
}//if end
//////////////////////////////////////////////////////
// 별점
// let starcnt = "";
// let star = Math.floor(aver/10);
// for (i=0; i<star; i++) {
// starcnt = starcnt + "*";
// }
// document.write(starcnt);
//
let star="";
for(let n=0; n<parseInt(aver/10);n++) {
star=star+"*";
}//for end
///////////////////////////////////////////////////////
// 장학생 여부
// let scholarship="";
// if(aver>=95) {
// scholarship = "장학생";
// } else {
// scholarship = "장학생 아님";
// }
// document.write(scholarship);
//
var special = " ";
if(aver>=95) {
special = "<span style='color:red; font-weight:bold'>장학생</span>";
}//if end
/////////////////////////////////////////////////////////////
//표 그리기
// let result = "";
// result = result + "<table border='1'>"
// result = result + "<tr>"
// result = result + "<th>이름</th>"
// result = result + "<td>손흥민</td>"
// result = result + "</tr>"
// result = result + "<tr>"
// result = result + "<th>국어</th>"
// result = result + "<td>"+kor+"</td>"
// result = result + "</tr>"
// result = result + "<tr>"
// result = result + "<th>영어</th>"
// result = result + "<td>"+eng+"</td>"
// result = result + "</tr>"
// result = result + "<tr>"
// result = result + "<th>수학</th>"
// result = result + "<td>"+mat+"</td>"
// result = result + "</tr>"
// result = result + "<tr>"
// result = result + "<th>총점</th>"
// result = result + "<td>"+total+"</td>"
// result = result + "</tr>"
// result = result + "<tr>"
// result = result + "<th>평균</th>"
// result = result + "<td>"+aver+"</td>"
// result = result + "</tr>"
// result = result + "<tr>"
// result = result + "<th rowspan=4>결과</th>"
// result = result + "<td>"+grade+"</td>"
// result = result + "</tr>"
// result = result + "<td>"+pnp+"</td>"
// result = result + "</tr>"
// result = result + "<td>"+starcnt+"</td>"
// result = result + "</tr>"
// result = result + "<td>"+scholarship+"</td>"
// result = result + "</tr>"
// result = result + "</table>"
// document.getElementById("demo").innerHTML=result;
//
let result="";
result += "<table border='1'";
result += "<tr>";
result += "<th>이름</th>";
result += "<td>" + name + "</th>";
result += "</tr>";
result += "<tr>";
result += "<th>국어</th>";
result += "<td>" + kor + "</th>";
result += "</tr>";
result += "<tr>";
result += "<th>영어</th>";
result += "<td>" + eng + "</th>";
result += "</tr>";
result += "<tr>";
result += "<th>수학</th>";
result += "<td>" + mat + "</th>";
result += "</tr>";
result += "<tr>";
result += "<th>총점</th>";
result += "<td>" + total + "</th>";
result += "</tr>";
result += "<tr>";
result += "<th>평균</th>";
result += "<td>" + aver + "</th>";
result += "</tr>";
result += "<tr>";
result = result + "<th rowspan=4>결과</th>"
result = result + "<td>"+grade+"</td>"
result = result + "</tr>"
result = result + "<tr>"
result = result + "<td>"+pass+"</td>"
result = result + "</tr>"
result = result + "<td>"+star+"</td>"
result = result + "</tr>"
result = result + "<td>"+special+"</td>"
result = result + "</tr>"
result += "</table>";
document.getElementById("demo").innerHTML=result;
</script>
</body>
</html>성적표
이중 반복문
반복문도 여러 번 중첩하여 사용이 가능하다.
이를 이용하여 구구단을 출력해보자
//문제) 구구단 2~9단 출력하기
for (let dan=2; dan<=9; dan=dan+1) {
document.write(dan + "단<br>");
for (let i=1; i<=9; i=i+1) {
document.write(dan+"*"+i+"="+(dan*i));
document.write("<hr>");
} // for end
document.write("<hr>");
} // for end
회전수 증가
//회전수 증가
let a=0, b=0;
for(a=1; a<=4; a=a+1){
for(b=1; b<=a; b=b+1){
document.write("#");
}
document.write("<br>");
} // for end
/*
a=1 1<=4
b=1 1<=1 #
2<=4
b=1 1<=2 #
2<=2 #
3<=4
b=1 1<=3 #
2<=3 #
3<=3 #
4<=4
b=1 1<=4 #
2<=4 #
3<=4 #
4<=4 #
*/
회전수 감소
//회전수 감소
for(a=4; a>=1; a=a-1){
for(b=1; b<=a; b=b+1){
document.write("$");
}
document.write("<br>");
} //for end
/*
a=4 4>=1
b=1 1<=4 $
2<=4 $
3<=4 $
4<=4 $
3>=1
b=1 1<=3 $
2<=3 $
3<=3 $
2>=1
b=1 1<=2 $
2<=2 $
1>=1
b=1 1<=1 $
2<=1 종료
0>=1 종료
*/
document.write(a+b); //0+2
for 연습문제
문제 1
//문1) 아래와 같이 출력하시오
/*
12345
23456
34567
45678
56789
*/
// for (let a=1; a<=5; a++) {
// document.write(a);
// for (b=a+1; b<=a+4; b++) {
// document.write(b);
// }
// document.write("<hr>")
// }
// document.write("<hr>")
// 풀이2
for(let a=0; a<5; a=a+1){
for(b=a+1; b<=a+5; b=b+1){
document.write(b);
} // for end
document.write("<hr>");
} //for end
/*
a=0 0<5
b=0+1 1<=0+5
2<=0+5
3<=0+5
4<=0+5
5<=0+5
a=1 1<5
b=1+1 2<=1+5
*/
문제 2
//문2)아래 그림과 같이 출력하시오
/*
@★★★
★@★★
★★@★
★★★@
*/
for (let a=1; a<=4; a=a+1) {
for(let b=1; b<=4; b=b+1) {
if(a==b){
document.write("@");
}else{
document.write("★");
} // if end
} // for end
document.write("<br>");
} // for end
/*
a=1 1<=4
b=1 1<=4 {if(1==1) @}
2<=4 {if(1==2) else ★}
3<=4 {if(1==3) else ★}
4<=4 {if(1==4) else ★}
2<=4
b=2 1<=4 {if(2==1) else ★}
2<=4 {if(2==2) @}
3<=4 {if(2==3) else ★}
4<=4 {if(2==4) else ★}
*/
문제 3
//문3) 아래와 같이 누적의 합을 출력하시오 (회전수 증가)
/*
1+ ... +10=55
1+ ... +20=210
1+ ... +30=465
1+ ... +90=
1+ ... +100=5050
*/
et sum = 0;
for (let j=1; j<=10; j++) {
for (let k=1; k<=j*10; k++) {
sum = sum + k;
}
document.write("1+..."+(j*10)+"="+sum);
sum = 0; //초기화
document.write("<br>");
}
document.write("<hr>")
// 풀이 2
let sum2=0; //누적의 합
for(let a=10; a<=100; a=a+10) {
for(let b=1; b<=a; b=b+1) {
sum2=sum2+b;
} // for end
document.write("1+..." + a + "=" + sum2);
document.write("<br>");
sum2=0; //초기화
} //for end
/*
a=10
b=1 1<=10 sum=0+1=1
2<=10 sum=1+2=3
3<=10 sum=3+3+6
...
10<=10 sum=45+10=55
a=20
b=1 1<=20 sum=55+1=56
*/위 코드에서 초기화 과정이 없으면 1+..10=55로 처음만 원하는 값이 나오고 이후로는 원하는 값이 나오지 않는다.
그 이유는 sum이 55가 된 상태에서 다시 반복을 하기 때문이다.
이러한 문제를 해결하기 위해 초기화하는 과정이 필요하다.
문제 4
//문4) 1~100사이 중에서 짝수의 합, 홀수의 합을 각각 구하시오
let even = 0;
let odd = 0;
for (let i=1; i<=100; i++) {
if (i%2==0) {
even = even + i
} else {
odd = odd + i
}
}
document.write("짝수의 합 : "+ even);
document.write("<hr>");
document.write("홀수의 합 : "+ odd);
document.write("<hr>");
// 다른 풀이
let flag = false;
let even2=0; //짝수의 합
let odd2=0; //홀수의 합
for(let a=1; a<=100; a=a+1){
if(flag){
flag=false;
even2 = even2+a;
}else{
flag=true;
odd2 = odd2+a;
} //if end
} //for end
/*
a=1 1<=100
if(false)
else {flag=true}
2<=100
if(true) {flag=false}
3<=100
if(false)
else {flag=true}
4<=100
if(true) {flag=false}
*/
document.write("짝수의 합 : "+ even2);
document.write("<hr>");
document.write("홀수의 합 : "+ odd2);
document.write("<hr>");
문제 5
//문5) 다음식의 결과를 구하시오
// 1 - 2 + 3 - 4 + 5 ... -100 = ?
let plema = false;
let sumplema = 0;
for (let i=1; i<=100; i++) {
if(plema) {
plema = false;
sumplema = sumplema - i;
} else {
plema = true;
sumplema = sumplema + i;
}
}
document.write("결과 : " + sumplema);
document.write("<hr>");
문제 6
//문6) 2g, 3g, 5g짜리 추가 각각 5개씩 있을때,
//세가지의 추의 조합으로 무게가 40~45사이일 때
//각 추의 갯수와 무게를 출력하는 프로그램
/*
출력결과
2g 3g 5g total
1 5 5 42
2 4 5 41
2 5 5 44
*/
let multisum = 0;
for (let d=0; d<=5; d++) { //2g
for (let e=0; e<=5; e++) { //3g
for (let f=0; f<=5; f++) { //5g
multisum = (d*2)+(e*3)+(f*5);
if (40<=multisum && multisum <=45) {
document.write(d+"개 "+e+"개 "+f+"개 "+" : "+multisum);
document.write("<br>");
} //if end
} //for end
} //for end
} //for end
'웹개발 교육 > JavaScript' 카테고리의 다른 글
| [12일] JavaScript (6) - 요일 구하기, Date 객체, 함수 (0) | 2022.08.10 |
|---|---|
| [11일] JavaScript (5) - 배열, 연습문제 (0) | 2022.08.09 |
| [9일] JavaScript (3) - switch ~ case문, for문, break, continue, while, do ~ while (0) | 2022.08.05 |
| [8일] JavaScript (2) - 형변환, Math, if문 (0) | 2022.08.04 |
| [7일] JavaScript (1) - 자료형, 연산자 (0) | 2022.08.03 |
