01 / 05
処理をまとめる(関数)
INPUT · スライド
関数から結果を返す
02 / 05
return の形
return 値; と書くと、その値が呼び出したところに返る。返ってくる値のことを戻り値と呼ぶよ。
add(3, 5) と書いた場所が、そのまま 8 に置き換わったと考えると分かりやすい。だから変数に入れることもできるし、そのまま表示することもできる。
function add(a, b) { return a + b;}const total = add(3, 5);console.log(total);console.log(add(10, 20));実行結果
8 30
03 / 05
return を書かないと undefined
return を書かない関数を呼ぶと、戻り値は undefined になる。「返す値が決まっていない」という意味だね。
計算はしているのに返していない、というのはよくある書き忘れ。結果が undefined になったら、まず return があるか確かめよう。
function add(a, b) { a + b;}console.log(add(3, 5));実行結果
undefined
04 / 05
return したらそこで終わり
return が実行されると、関数はその場で終わる。下に行が残っていても実行されないよ。
この性質を使うと、条件ごとに違う値を返す関数が書ける。else を書かなくても、先に return してしまえば下には進まないんだ。
function judge(score) { if (score >= 60) { return "ごうかく"; } return "ふごうかく";}console.log(judge(72));console.log(judge(40));実行結果
ごうかく ふごうかく
05 / 05
表示する関数と、返す関数
console.log する関数と return する関数。この2つは役割が違うよ。
- 表示する関数 … 画面に出すのが仕事。結果は持ち帰らない
- 返す関数 … 計算するのが仕事。表示は呼び出した側にまかせる
返す関数のほうが使い回しがきく。表示したければ console.log(add(3, 5)) と書けばいいだけだからね。
それじゃあ、返す関数を書いてみよう。