JSの戻り値の問題

今日、JS関数の戻り値についての記事をインターネットで見かけました。 JS関数にはいくつか難しい点があります。 js関数が別の関数を返す問題について上で述べましたが、インタビューの質問を添付しましたので共有します

[javascript] view plain copy
var add = function(x){  
    var sum = 1;  
    var tmp = function(x){  
        sum = sum + x;  
    return tmp;  
    }  
    tmp.toString = function(){  
        return sum;  
    }  
    return tmp;  
} // alert(add(1)(2)(3)) --> 6

次に、別の関数を返す問題について詳しく説明します。

実は私は Java 出身で、最初にその記事を見たとき、別の関数を返すことについてあまり知りませんでした。この記事を書いた理由は、最後の呼び出しメソッドです

。

[javascript] view plain copy

add(1)(2)(3)

Java でこのような関数呼び出しメソッドを見たことがなかったので、注目を集めたので、いくつか調査して共有することにしました。もちろん、これについてすでに深く理解している場合は、スキップすることも、欠点を指摘して笑い飛ばすこともできます。さて、さっそく本題に入りましょう。

最も単純な例を見てみましょう:

[javascript] view plain copy
function create1(pro) {  
    console.log("pro : " + pro);  
    return function(obj1, obj2){  
        console.log(obj1 + " -- " + obj2);  
        return obj1 + obj2;  
    }  
}

単純な関数 create1 を作成しました。これには戻り値があり、戻り値は 内部関数 です。関数が構築されたら、次にそれを呼び出しましょう:

[javascript] view plain copy
var c1 = create1("pro"); // 创建函数

私のこれまでの理解によれば、このメソッドを呼び出すと pro: pro が出力され、その後エラーが報告されるはずです。これを読んで私と同じ考えを持った人は、考えすぎや固定観念を持っていることをおめでとうございます

。実際のところ、上記のコードを通じて呼び出すと、ログには pro : pro が出力されますが、エラーは報告されず、繰り返し呼び出した後は同じログが前後に出力されるだけです。これは、この時点では create1() メソッドに入っただけで、関数の内部関数には入っていないことも意味します。面接の質問に触発されて、一度呼び出してみたところ、その後の結果が出力されることがわかりました。

[java] view plain copy
c1(1, 2); // 调用函数

次のログが出力されます。これは、最初にメソッドを呼び出したときに、実際には内部関数に入っていないことを示しています。内部関数には、再度呼び出すことによってのみ入ることができます。このとき、上記の呼び出しを繰り返すと、内側の層の関数本体のみが呼び出され、外側の関数本体は存在しません。

このような関数は別の関数を返します。最初の呼び出しでは、外側の関数本体オブジェクトを構築するだけです。繰り返しの呼び出しでは、内側の関数本体のみが繰り返されます。

心配しないでください、まだ終わっていません。まだ続きがあります...

次に、別の状況を見てみましょう。最初に加算を行う関数を宣言します:

[javascript] view plain copy
function infun(obj1, obj2) {  
    console.log(obj1 + " -- " + obj2);  
        return obj1 + obj2;  
}  
然后再声明一个函数，在该函数中调用上面声明的函数：
[javascript] view plain copy
function create2(pro) {  
    console.log("pro = " + pro);  
        return infun(obj1, obj2); // 这个时候,会报错  
}

最後に、

を呼び出します。

[javascript] view plain copy
var c1 = create2("pro");

ログを確認します:

pro = pro
‌Uncaught ReferenceError: obj1 is not defined

ログを出力した後、例外がスローされることがわかります。メソッドにいくつかの変更を加えます。

[javascript] view plain copy
function create2(pro) {  
    console.log("pro = " + pro);  
    var obj1 = 1, obj2 = 2;  
    return infun(obj1, obj2); // 这个时候,会报错  
}

が呼び出されると、正常に実行され、2 つのログ レコードが出力されます。

これは、これと同様に、関数内で宣言された関数を返すことは、実際には宣言された関数を呼び出していることを示しており、上記の状況とは異なります。

さて、冒頭のインタビューの質問を振り返って詳しく見てみましょう。すると、すべてが明らかであることがわかります:

[javascript] view plain copy
// 声明一个函数表达式  
var add = function(x){  
    var sum = 1;  
    // 在函数表达式内部有一个求和的内部函数  
    var tmp = function(x){  
        sum = sum + x;// 求和  
        return tmp;  
    }  
    // 构建一个函数体的toString()函数  
    tmp.toString = function(){  
        return sum;  
    }  
    return tmp; // 返回的是一个函数体,如果该函数体有toString()方法,则会调用函数体的toString()方法  
}

次に、通話を見てみましょう:

[javascript] view plain copy
alert(add(1)(2)(3))

結果は 6 です。理由は次のとおりです。最初のものと同じです。次に、繰り返し呼び出します。

[javascript] view plain copy
// 以下结果输出为：6  
alert(add(10)(2)(3))  
alert(add(100)(2)(3))  
// 下面的结果输出变了  
alert(add(1)(3)(3))  
alert(add(1)(2)(5))

これらのケースを読んだ後は、この方法を習得したと思います。さらに興味深い情報については、他の関連記事に注目してください。 PHP中国語ウェブサイトです！

関連書籍:

DIV の高さを適応させる方法

CSS を使用して画像の背景のテキストコンテンツを非表示にする方法

CSS を使用して HTML で div を非表示にする方法

以上がJSの戻り値の問題の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。