웹_프론트_백엔드/프론트엔드

과제-자료를 받아 출력하는 프로그램

shine94 2020. 8. 14. 19:28

아래와 같은 형식의 자료를 받아 출력하는 프로그램을 만들어보자.


입력 예) prompt로 아래의 4개를 입력 받기
           이름을 입력하세요.
           HTML 점수를 입력하세요.
           CSS 점수를 입력하세요.
           JavaScript 점수를 입력하세요.

출력 예) console로 아래의 정보 출력
            XXX 님 성적
            HTML : XXX점
            CSS : XXX점
            JavaScript : XXX점
            총점 : XXX점
            평균 : XXX점

 

** 소스코드

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>homework</title>
</head>
<body>
    <h2>숙제</h2>
    <script>
        "use strict";
        let name = prompt('이름을 입력하세요');
        let HTMLScore = Number(prompt('HTML 점수를 입력하세요.'));
        let CSSScore = Number(prompt('CSS 점수를 입력하세요.'));
        let JavaScriptScore = Number(prompt('JavaScript 점수를 입력하세요.'));

        let sum = HTMLScore + CSSScore + JavaScriptScore;
        let avg = parseFloat(sum / 3.0);

        console.log(name + '님의 성적\n');
        console.log("HTML : " + HTMLScore + '점\n');
        console.log("CSS : " + CSSScore+ '점\n');
        console.log("JavaScript : " + JavaScriptScore+ '점\n');
        console.log("총점 : " + sum + '점\n');
        console.log("평균 : " + avg.toFixed(2) + '점\n');
    </script>
</body>
</html>

 

** 입력


** 출력

 

** 과제를 하면서 배운점
1. 연산하면서 자바스크립트의 자료형에 대한 이해도가 높아졌다.

   (특히, 평균 소수점 2자리까지 출력하는 과정 중)

'웹_프론트_백엔드 > 프론트엔드' 카테고리의 다른 글

2020.08.30  (0) 2020.08.30
2020.08.29  (0) 2020.08.29
2020.08.09  (0) 2020.08.12
2020.08.08  (0) 2020.08.10
학습목표 및 일정  (0) 2020.08.10