JavaScript_test/scoring.js at master · yusuke7755/JavaScript_test · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
// DOMの読み込みが終わったらfunction()の中の処理を実行します。
$(document).ready(function(){

  // [国語の点数,英語の点数,数学の点数,理科の点数,社会の点数]の入力値を取得して合計点と平均点を出すロジックを作ります。
  function score_indicate(){

    // 変数「subject_points」に
    // [国語の点数,英語の点数,数学の点数,理科の点数,社会の点数]の配列を代入します。
    let subject_points = [Number($('#national_language').val()),
                          Number($('#english').val()),
                          Number($('#mathematics').val()),
                          Number($('#science').val()),
                          Number($('#society').val())
                          ];

    // 変数「sum」に
    // [国語の点数,英語の点数,数学の点数,理科の点数,社会の点数]をそれぞれ足します。
    let sum = 0;
    let number = subject_points.length;

    let i = 0;
    for (let i = 0; i < number; i++) {
      // 配列の数だけループされ加算される。
      sum += subject_points[i];
    }

    // 「合計点：」(id="sum_indicate")に変数「sum」(合計点)を出力させます。
    $("#sum_indicate").text(sum);

    // 変数「average」に
    // 平均値を出して代入します。(平均をとりたい数の合計点数(sum) / 全体の個数)
    // 2 5教科の合計点と平均点が正しい値で表示されること
    let average = sum / number;
    $("#average_indicate").text(average);

  };

  // 平均点数を取得し、取得した平均点数からランク分け("A", "B", "C", "D")をするロジックを作ります。
  function get_achievement(){

      // 変数「averageIndicate」に
      // 平均点数をHTML上のid="average_indicate"から取得して代入します。
      let averageIndicate = $("#average_indicate").text();

      // 3 「ランク」ボタンを押した際、5教科の平均点が80点以上なら「A」、60点以上なら「B」、40点以上なら「C」、それ以外なら「D」を表示させること
      // もし「averageIndicate」が80以上なら"A"を返します。
      if ( averageIndicate >= 80){
        return "A";
        // もし「averageIndicate」が60以上なら"B"を返します。
      } else if ( averageIndicate >= 60) {
        return "B";
        // もし「averageIndicate」が40以上なら"C"を返します。
      } else if ( averageIndicate >= 40) {
        return "C";
        // もし「averageIndicate」がそれ以外の点数なら"D"を返します。
      } else {
        return "D";
      }
  };

  // 各教科の点数を取得し、取得した点数から合格/不合格の判断を下すロジックを作ります。
  function get_pass_or_failure(){

    let subject_points = [Number($('#national_language').val()),
                          Number($('#english').val()),
                          Number($('#mathematics').val()),
                          Number($('#science').val()),
                          Number($('#society').val())
                          ];

    // 変数「number」に入力した教科の数を代入します。
    let number = subject_points.length;

    // 変数「judge」に"合格"を代入しておきます。
    let judge = "合格";

    // 入力したそれぞれの教科の点数が60点よりも低いと変数「judge」に"不合格"を再代入して「judge」を返します。
    // ヒント! 「javascript 点数 合格 不合格 ロジック」で検索してみてください。
    // 4 「判定」ボタンを押した際、すべての教科が60点以上なら「合格」、一つでも60点未満の教科があった場合は「不合格」を表示させること
    for (let i = 0; i < number; i++) {
      if (subject_points[i]<60){
        judge = "不合格";
        break;
      };
    };

    return judge;

  };

  // 最終的なジャッジのロジックを作ります。
  function judgement(subejct_points){

    // 変数「achievement」に「get_achievement()の戻り値」を代入します。
    let achievement = get_achievement(subejct_points);

    // 変数「pass_or_failure」に「get_pass_or_failure()の戻り値」を代入します。
    let pass_or_failure = get_pass_or_failure(subject_points);

    // 「最終ジャッジ」(id="alert-indicate)ボタンを押したら「あなたの成績は${achievement}で${pass_or_failure}です」が出力される処理です。
    $('#declaration').append(`<label id="alert-indicate" class="alert alert-info">あなたの成績は${achievement}で${pass_or_failure}です</label>`);
  };
  // [国語の点数,英語の点数,数学の点数,理科の点数,社会の点数]のいずれかの点数が変更された際に「function score_indicate()」を起動させる処理です。
  $('#national_language, #english, #mathematics, #science, #society').change(function() {
    score_indicate();
  });

  // 「ランク」(id="evaluation")ボタンを押したら「get_achievement()」が出力される処理です。
  // 3 「ランク」ボタンを押した際、5教科の平均点が80点以上なら「A」、60点以上なら「B」、40点以上なら「C」、それ以外なら「D」を表示させること
  $('#btn-evaluation').click(function() {
    $("#evaluation").text(get_achievement());
  });

  // 「判定」(id="btn-judge")ボタンを押したら「function et_pass_or_failure()」が出力される処理です。
  // 4 「判定」ボタンを押した際、すべての教科が60点以上なら「合格」、一つでも60点未満の教科があった場合は「不合格」を表示させること
    $('#btn-judge').click(function() {
    $("#judge").text(get_pass_or_failure());
  });

  // 「最終ジャッジ」(id="btn-declaration")ボタンを押したら「function judgement()」が出力される処理です。
  $('#btn-declaration').click(function() {

    let achievement = get_achievement();
    let pass_or_failure = get_pass_or_failure();
        // 5 「最終ジャッジ」のボタンを押した際、ランクと合否を「あなたの成績は〇〇です。××です。」という内容で表示させること
        // 6 「最終ジャッジ」のボタンを連打した際、「あなたの成績は〇〇です。××です。」という内容を複数表示させないようにすること
        $("#declaration").text(`あなたの成績は${achievement}です。${pass_or_failure}です。`)
        .css("background-color", "Cyan")
        .css("margin", 10)
        .css("padding", 10)
        .css("border-radius", 10)
      });
    });