이전 페이지에서 배운 내용들을 실습을 통해 복습해보고,
조건문 문제를 공부해보려고 한다.
<body>
<h1></h1>
<script>
// 문제: 성적 등급 매기기
// 문제 설명: 사용자로부터 성적을 입력받아, 해당 성적의 등급(A, B, C, D, F)을 출력하는 프로그램을 작성하세요.
// 조건:
// 90점 이상이면 A
// 80점 이상 90점 미만이면 B
// 70점 이상 80점 미만이면 C
// 60점 이상 70점 미만이면 D
// 60점 미만이면 F
const h1 = document.querySelector(`h1`);
const grade = parseInt(prompt(`성적을 입력하시오.`));
if (grade >= 90) {
h1.textContent = `A`;
} else if (grade >= 80) {
h1.textContent = `B`;
} else if (grade >= 70) {
h1.textContent = `C`;
} else if (grade >= 60) {
h1.textContent = `D`;
} else if (grade < 60) {
h1.textContent = `F`;
}
</script>
</body>
</html>- 성적이 입력될 h1태그를 h1이라는 변수에 저장했다.
- prompt창을 띄울 grade라는 변수를 만들었다. parseInt를 통해 성적을 입력하여 얻을 숫자 '문자열'을 숫자형으로 변환했다. (정확한 연산을 위해)
- 조건문을 "grade >= '임의의 숫자'"의 양식으로 각 숫자별로 구분지었다.
회고:
1. 우선 parseInt라는 메소드가 꼭 필요할지가 의문이었다. 물론 prompt의 결과값은 문자열이라는 것을 알고 있고 if문에서 비교할 데이터는 숫자형이었지만 자바스크립트의 암묵적 타입 변환 기능 때문에 문제 없을 것이라고 생각했다.
하지만 지금은 간결한 문제일 뿐이므로 문제가 없겠지만 실무에 들어갔을 때나 더 복잡한 개발을 해야할 때 코드가 불확실하여 예기지 않은 데이터로 변환되거나 해서 문제가 생길 수도 있다는 생각이 들었다. 지금은 간단한 문제를 푸는데 그치지만 나중을 위하여 자료형을 명확히 해야겠다는 생각이 들어 위 코드를 추가하게 되었다.
조금 더 난이도 높은 문제를 풀어보았다.
//점수가 90점 이상이면 "A" 등급을 출력합니다.
//점수가 80점 이상 89점 이하이면 "B" 등급을 출력합니다.
//점수가 70점 이상 79점 이하이면 "C" 등급을 출력합니다.
//점수가 60점 이상 69점 이하이면 "D" 등급을 출력합니다.
//점수가 60점 미만이면 "F" 등급을 출력합니다.
//또한, 사용자가 입력한 점수가 0에서 100 사이가 아닌 경우 "유효하지 않은 점수입니다."라는
//메시지를 출력해야 합니다. function grade(num) {
if (num < 0 || num > 100) {
console.log(`유효하지 않은 점수입니다.`)
} else if (num >= 90) {
console.log(`A`)
} else if (num >= 80) {
console.log(`B`)
} else if (num >= 70) {
console.log(`C`)
} else if (num >= 60) {
console.log(`D`)
} else {
console.log(`F`)
}
}
grade(59);- 함수형 표현식을 사용해 grade라는 함수에 num이라는 파라미터를 받는 식을 썼다.
- 우선 num이 0보다 작거나 100보다 클 경우, 둘 중에 한 조건이 맞을 경우 경고 문구가 뜨게 만들었다.
- 그 외 각각 숫자별로 나오는 성적을 다 다르게 작성했다.
회고: 논리 연산자를 사용해서 조건을 만들었다.
hyohyo