コードを見ていただきたいです。

$(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())
                          ];

    // さらにこのような記述をすることで、「合計点：」となっている右の部分に合計点が出力される
    let sum = subject_points[0];
    sum = sum + subject_points[1];
    sum = sum + subject_points[2];
    sum = sum + subject_points[3];
    sum = sum + subject_points[4];
    $("#sum_indicate").text(sum);

    // ここに、上記を参考にして平均点を出力する処理を書き込む
    let num = subject_points.length;
    let average = (sum/num);
    $('#avarage_indicate').text(average);
  };
  function get_achievement(){
    // ここに、ランクの値の文字列（平均点が80点以上なら"A"、60点以上なら"B"、40点以上なら"C"、それ以下なら"D"）を出力する処理を書き込む
    let sum =0;
    let num =subject_points.length;
    for(let i=0; i<num; i++) {
      sum += subject_points[i];
    }
    if (sum >= num*0.8*100) {
      // return "A";
      $('#evaluation').text("A");//このHTMLのidに表示させたいです。
    }
    else if (sum >= num*0.6*100) {
      return "B";
    }
    else if (sum >= num*0.4*100) {
      return "C";
    }
    else {
      return "D";
    }
  };

```###function get_achievement()から下がうまくかけません。
console.logで引数を渡してこのコードを成立させるにはどうしたらいいのか？
戻り値で$('#evaluation').text("A")に表示させたい場合はどのようにかけばいいのか？
私が的外れなやり方をしているのが原因だと思うので、質問を無視してコードを直して動くようにしていただいても結構です。
よろしくお願いします。

行動規範の内容に同意します

回答1件

ベストアンサー

ここでのポイントは「関数を情報の加工として使おう」ということです。

プログラミングの鉄則は

input
processing
output

です。
まずは各種関数を作りましょう。

最後のachievementは平均点がn点以上かの条件に従ってA〜Dの文字列を返す
平均点を求める為にavg関数を用意
平均は合計 / 数で求められるので合計を返す関数を用意

関数実行時にreturnを見つけるとそこで関数から逃げてしまうので、
else ifで延々つなげるよりは、ifにした方がタイプ数も減りますのでコードが若干読みやすくなります。

JavaScript
1// 合計を返す関数
2function sum (points) {
3  let sum = 0;
4  for (let i = 0; i < points.length; i++) {
5    sum += points[i];
6  }
7  return sum;
8}
9
10// 平均点を返す関数
11function avg (points) {
12  return sum(points) / points.length;
13}
14
15// 結果を返す関数
16function achievement (points) {
17  var a = avg(points);
18  // 確実に1行で終わるケースならこれでいい
19  if (a >= 80) return "A";
20  if (a >= 60) return "B";
21  if (a >= 40) return "C";
22  return "D";
23}

こんなの一瞬で用意出来ますね。
ではメインの処理を作りましょう。

JavaScript
1function score_indicate(){
2  // 既存のコードでも全然悪くないけど
3  // ちょっと洒落た作り方でsubject_pointsを作ってみる
4  const subject_points = ['national_language', 'english', 'mathematics', 'science', 'society'].map(function(id){
5    return parseInt($('#'+id).val());
6  });
7
8  // 結果を出力
9  $("#sum_indicate").text(sum(subject_points));
10  $('#avarage_indicate').text(avg(subject_points));
11  $('#evaluation').text(achievement(subject_points));
12};

まぁ、ピラミッドのように何度もsum関数を叩いているので実行速度は多少落ちますが、
5個の数値を合計する程度のことしかやっていないので、誤差みたいなものでしょう。
一気に計算しようと頑張ると辛くなります。

蛇足のおまけ

letを使っているということはIE11対応しなくて良いんでしょうか？
ならばES2015の書き方が出来ますね。

もし私がガチで作るならこんな感じになるでしょう。
数値の配列から合計を求めるのは1行のイディオムで可能ですので、
achievementが求めるものを平均点に変更して割り出します。

JavaScript
1function achievement (avg) {
2  if (avg >= 80) return "A";
3  if (avg >= 60) return "B";
4  if (avg >= 40) return "C";
5  return "D";
6}
7
8function score_indicate(){
9  const points = ['national_language', 'english', 'mathematics', 'science', 'society'].map(id => parseInt($('#'+id).val()));
10  const sum = points.reduce((a, b) => a + b, 0);
11  const avg = sum / points.length;
12
13  $("#sum_indicate").text(sum);
14  $('#avarage_indicate').text(avg);
15  $('#evaluation').text(achievement(avg));
16}