IT~情報と技術

ドットインストール「詳解JavaScript 基礎文法編」で勉強#21(returnで値を返す)

ドットインストールというオンラインのプログラミング講座に「詳解JavaScript」というのがあります。

これでJavaScriptの基礎を勉強していきましょう。まずは「基礎文法編」から。

今日のメイントピックは、引数を使ってみよう、です。

詳解JavaScript

ドットインストールのレッスン一覧に「②もっと詳しくJavaScriptを学ぼう」というセクションがあります。

ここに3つ並んでいる

  • 詳解JavaScript 基礎文法編(全24回)
  • 詳解JavaScript オブジェクト編(全23回)
  • 詳解JavaScript DOM編(全15回)

で勉強していきたいと思います。

これまでの勉強した内容はこちらです。

基礎文法編 #21

詳解JavaScript 基礎文法編 #21 returnで値を返してみよう ←講座はこちら

今日は関数から呼び出し元に値を返すreturnが出てきました。

return

関数を呼び出して、入力値として引数を渡しますが、呼び出し元に返す出力をreturnで指定することができます。

JavaScriptのreturnに関しては、MDNのreturnに説明がありました。

return 文は関数の実行を終了して、関数の呼び出し元に返す値を指定します。(MDNのreturnから)

returnを使うと関数の実行がそこで停止するので、注意しましょう。

講座で出てきたreturn

以下のような例で練習しました。

まずは、returnを使わない例です。

function sum(a, b, c) を呼び出すと、 console.log(a + b + c); が実行されて、a+b+cの結果がコンソールに表示されます。

a+b+cの計算結果は返ってきません。

フローチャートだとこんな感じでしょうか。

次に、returnを使う例です。

function sum(a, b, c) を呼び出すと、 return a + b + c; が実行されて、a+b+cの結果が関数を呼んだ呼び出し元に返されます。

呼び出し元で、a+b+cの計算結果を使って新たな計算を行うことができます。

フローチャートだとこんな感じでしょうか。

返ってきた値を使って、totalを計算しています。

復習

const total = sum(1, 2, 3) + sum(3, 4, 5) が出てきましたね。

constはドットインストール「詳解JavaScript 基礎文法編」で勉強#07(定数を使う)で出てきました。

  • 再代入による変更はできず
  • 再宣言もできません

ということで「一度設定したら変更したくない値に使う。」のに適している、でした。

今日のまとめ

今回は、関数から返す値を指定するreturnについてでした。

超スローペースなプログラミング学習ですが、マイペースでぼちぼち続けています。

JavaScriptはちょっと難しいですが、がんばって一通りやってみましょう!