javascriptの返り値について

Question

function attack(item) {
  if (item === "手裏剣") {
    return "相手に大ダメージを与えた！";
    
  } 
  
  return "相手にダメージを与えた！";
}

console.log(attack("手裏剣"));

returnが2つあるのですが、一つ目のreturnで呼び出し元に返る気がするのですが、
どうして↑のようなコードになるのか、理屈を教えて頂けないでしょうか。

Answer 1

ちょっと別の書き方をすると

function attack(item) {
  if (item === "手裏剣") {
    return "相手に大ダメージを与えた！";
  } else {
    return "相手にダメージを与えた！";
  }
}

リターンが気になるなら

function attack(item) {
  var x = "相手にダメージを与えた！";
  if (item === "手裏剣") {
    x = "相手に大ダメージを与えた！";
  }
  return x;
}

コードを減らすなら

function attack(item) {
  return (item === "手裏剣") ? "相手に大ダメージを与えた！" : "相手にダメージを与えた！";
}

拡張性を考えるなら

function attack(item) {
  var msg = ["相手にダメージを与えた！","相手に大ダメージを与えた！"]
  var i;
  switch (item) {
    case "手裏剣": i = 1; break;
    default: i = 0;
  }
  return msg[i];
}

とまあ、同じ機能を実現するにもいろんな書き方がありまして。
で、今回の質問で提示されたコードは、条件によって
return は一回しか実行されないことを見極めましょう。

Comments

[退会済みユーザー]

色々な書き方があるのですね・・。

Answer 2

item が "手裏剣"じゃない場合を考えればわかると思います。

Answer 3

// これだとif条件に当てはまるので上のreturnで呼び出し元に戻る
console.log(attack("手裏剣"));


// これだとif条件に当てはまらないので下のreturnで呼び出し元に戻る
console.log(attack("hoge"));

条件一致したときとしないときで返したい値を変えたいからやっているのではと思います。

Comments

[退会済みユーザー]

ありがとうございます。else { return "相手にダメージを与えた！";}というふうにしなくてよいのですね

[rururu3]

elseでやってもいいですが、最後で値を必ず返すとわかりやすいからこういう書き方のほうが良かったはず
＆ガード節・・・っていう手法だったはず