ProgateのJavascriptコースでの疑問箇所

Question

質問内容

Javascriptの勉強を始めたばかりの者です。

本日ProgateのJavascriptコースの問題に取り組んだのですが、
正解判定だったものの自分の回答と見本のコードの違いについて、
不明な点があったのでご質問させていただきたいです。

以下が問題の内容です

①アロー関数を用いて、getMax関数を定義してください。
（ただし、a,b,cの3つの引数を取るようにすること）

②引数a,b,cのうち一番大きい値を戻り値にすること

③getMax関数を用いてnumber1, number2, number3の最大値を取得し、
最大値は○○です
となるように出力してください。
（○○の部分に最大値が入ります）

私はa,b,cの3つの値の最大値は
「b>maxかつb>c」の場合b、「c>maxかつc>b」の場合c
と考えました。
ところが見本コードを確認すると
「b>max」なら最大値b、「c>max」なら最大値cなっており
bとcの大小を比較していないことに違和感を感じました。

私のコード、考え方の中で間違っている箇所がありましたら、ご指摘いただきたいです。
初学者のつたない質問で大変恐縮ですが、よろしくお願いいたします。

自分のコード

const number1 = 103;
const number2 = 72;
const number3 = 189;

// getMax関数を定義してください
const getMax = (a,b,c) => {
  let max = a;
  if(b > max && b > c){
    max = b;
  }
  else if(c > max && c > b){
     max = c;
  }
  return max;
};

// 「最大値は○○です」と出力してください
console.log(`最大値は${getMax(number1,number2,number3)}です`);

見本コード

const number1 = 103;
const number2 = 72;
const number3 = 189;

// getMax関数を定義してください
const getMax = (a, b, c) => {
  let max = a;
  
  if (b > max) {
    max = b;
  }
  if (c > max) {
    max = c;
  }
  
  return max;
};

// 「最大値は○○です」と出力してください
const max = getMax(number1, number2, number3);
console.log(`最大値は${max}です`);

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Comments

[kei344]

（質問文は編集できます）質問文のコードはそれぞれコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

[motsu418]

ご指摘いただきありがとうございます。
それぞれコードブロックで囲んでおきました。

Answer 1

考え方

注目すべきは条件分岐 ですね（２つ目で esle if を使うか、if を使うか）。

else if の場合

1. 引数 a を最大値として仮定する。
2. 引数の a < b && c < b を評価し、真なら b が最大値。
3. 引数の a < c && b < c を評価し、真なら c が最大値。

if の場合（見本コード）

1. 最大値を a と仮定する
2. a < b を評価して、真なら最大値を b と仮定しなおす。
3. b < c （2.で真）または a < c（2.で偽）を評価して、真なら最大値は c とする。

const getMax = (a, b, c) => {
  let max = a; // 1.
  if (b > max) { // 2.
    max = b;
  }
  if (c > max) { // 3.
    max = c;
  }
  return max;
};

細かく比較すると、関数内の処理はニュアンスの異なるものになりますが、問われたのは「最大値を求める」ことであり、他の条件も守った「正答」になります。

Comments

[motsu418]

ご丁寧に回答いただきありがとうございます！
質問時点ではifが2つ使われる条件分岐のイメージがあまりできていなかったようです。
「仮定しなおす」という表現がとてもしっくりきました！

[AkitoshiManabe]

3. で「b < c （2.で真）」と説いたとおりで、違和感の正体は「実は、bとcの大小を比較していた」ということになります。

Answer 2

順番に処理をしているので特におかしなところはありません
まずaがmaxを想定して、b,cがmax未満ならaを採用されまxす
bがmaxになったらbが採用され、それよりcが大きければcが採用
そうでなければbがそのまま採用
常にmaxが塗り替えられているわけです

ただしmax値をとる関数は最初から用意されているので、
比較演算子を必ずつかうという条件がないなら一発でいけるのでは？

const getMax=(a,b,c)=>Math.max(a,b,c);
var result=getMax(number1,number2,number3);
console.log(`最大値${result}です`);

Comments

[motsu418]

丁寧なご回答ありがとうございます！
「順番に処理をしているので...」まさにその通りでした！
maxが置き換わっていくのであれば何も問題ありませんね。
まだまだ基礎的な考え方が身についていなかったようです。

また最大値をとる関数についても教えいただきありがとうございます！
確かにこちらを使ったほうがよりスマートに記述できますね。