今日、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中国語ウェブサイトです!
関連書籍:
CSS を使用して画像の背景のテキストコンテンツを非表示にする方法
CSS を使用して HTML で div を非表示にする方法
以上がJSの戻り値の問題の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。