JavaScriptでのreturnの使い方は何ですか-フロントエンドQ&A-php.cn

JavaScriptでのreturnの使い方は何ですか

青灯夜游

リリース： 2022-02-07 15:35:12

オリジナル

8270 人が閲覧しました

JavaScript での return の使用法: 1. 基本データ型、オブジェクト、関数などを含む任意のタイプの値を返すことができる関数値を返す; 2. 戻り値なしで return ステートメントを使用して、いつでも関数を実行できます。

JavaScriptでのreturnの使い方は何ですか

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

JavaScript の return ステートメントの関数定義には 2 つの関数があります:

1 つは関数の値を返すもので、
2 つは関数の実行を中止することです。

return ステートメントは、基本的なデータ型、オブジェクト、関数などを含む任意の型の値を返すことができます。すべての関数は値を返します。 return ステートメントが使用されていない場合、または return が使用されているがその後に戻り値が指定されていない場合、関数は「未定義」値を返します。「未定義」以外の値を返す必要がある場合は、return を使用して戻り値を指定する必要があります。

関数は return 文を実行すると、直ちに関数の値を返して関数の実行を終了しますが、このとき return 文以降のコードは実行されません。このような return 文の性質により、関数の実行を早期に終了する必要がある場合には、関数の実行をいつでも終了できるように、戻り値のない return 文がよく使用されます。

[例 1] return ステートメントは関数の値を明示的に返します。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>return语句显式返回函数值</title>
<script>
   function expressionCaculate(x){
     if((x >= -10) && (x <= 10)){
         return x * x - 1;
     } else {
         return 5 * x + 3;
     }
   }
   console.log(expressionCaculate(6));
   console.log(expressionCaculate(12));
</script>
</head>
<body>
</body>
</html>

ログイン後にコピー

expressionCaculate() の return の後には式が続きます。関数が return ステートメントを実行すると、最初に式の値が計算され、次に値が返されます。関数が呼び出されると、x に渡された値に応じて、異なる式の値が返されます。

[例 2] return ステートメントは関数の実行を終了します。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>return语句中止函数执行</title>
<script>
   function add(a,b){
     if(a > b){
         console.log("a大于b");
         return;
         console.log("a+b=" + (a + b));
     }
     console.log("a+b=" + (a + b));
   }
   add(7,3);
</script>
</head>
<body>
</body>
</html>

ログイン後にコピー

add(7,3) コードが実行されると、add() メソッドが呼び出されます。このとき、最初のパラメーターの値は 2 番目のパラメーターより大きく、" 「a は b より大きい」とコンソールに出力されると、関数はリターンして実行を停止するため、return 文以降の 2 つのログは出力されません。実行結果を図 1 に示します。

JavaScriptでのreturnの使い方は何ですか
図 1: return ステートメントによる関数の実行結果の中止

[例 3] return ステートメントは関数を返します。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>return语句返回函数</title>
<script>
   function outerFunc(){
        var b = 0;
       return function(){ //返回匿名函数
            b++;
            console.log("内部函数中b=" + b);
        }
   }
   var func = outerFunc();
   func();
</script>
</head>
<body>
</body>
</html>

ログイン後にコピー

outerFunc() 関数は匿名関数を返すため、outerFunc 関数の呼び出し式は関数式になり、変数 func を使用して匿名関数を呼び出すことができます。実行結果を図 2 に示します。

JavaScriptでのreturnの使い方は何ですか
図 2: return ステートメントを呼び出して返される匿名関数