JavaScriptのreturnステートメントの仕組みを徹底解説

JavaScriptにおけるreturnステートメントは、関数の実行をその時点で停止し、関数の内部から値を呼び出し元へ返すために使われる構文です。

returnがないとどうなる？

まず、名前を受け取る関数 addName を用意してみましょう。

let addName = function(name) {}

続いて、この addName() 関数に名前を渡します。

let myNameIs = addName("David")

この時点で、addName 関数の中には文字列 "David" を持つ変数 name が存在しています。しかし、この変数とその値は関数の内部に閉じ込められているため、外部からは利用できません。

試しに次のようにアクセスしてみると：

console.log(myNameIs)
// undefined

結果は undefined になってしまいます。これは、関数が何も値を返していないためです。

returnを使って値を返す

ここで登場するのが return です。関数の中に return name を追加して、もう一度コンソールに出力してみましょう。

let addName = function(name) {
  return name
}

let myNameIs = addName("David")

console.log(myNameIs)
// "David"

今度はきちんと "David" が出力されました！ 関数の内部にある値を、return を通じて外部に取り出せたわけです。

returnの重要なポイント

• 実行の停止： return が実行された時点で関数の処理は終了し、それ以降に書かれたコードは実行されません。
• 省略時の挙動： return を書かなかった場合、JavaScriptの関数は自動的に undefined を返します。
• 任意の値を返せる： 文字列だけでなく、数値・オブジェクト・配列・別の関数など、あらゆる値を返すことができます。

関数から結果を受け取って活用したい場面は非常に多いため、return の使い方はJavaScriptの基礎として必ず押さえておきましょう。