js関数の自己実行関数

コードを書くとき、私はよく tpl の に同様のコードを書きます:

$(function(){ alert("我好饿"); }); 最初にコードを書き始めたときは、それを呼び出す必要がなく、そのまま実行されることだけを知っていました。 , I たくさんのコードが書かれました。そうは言っても、この製品の読み込みシーケンスについても説明したいと思います。script タグにコードを直接記述すると、ページが読み込まれるときに script タグ内のコードが実行されます。アンロードされた DOM がこのコードで使用されたり、アンロードされたメソッドが呼び出されたりすると、エラーが報告されます。もっと身近なところでは、この関数は実際には自己実行関数であり、専門的には「即時に呼び出される関数式」と呼ぶ人も多いでしょう。

ここでは、より専門的な感じのlimlimlimさんのブログを引用します...元のアドレス

function foo(){} や var foo = function(){} のような関数を宣言するときは、最後に括弧を追加します。 foo() などの自己実行を実現できます。コードを見てください:

// 因为想下面第一个声明的function可以在后面加一个括弧()就可以自己执行了，比如foo()，// 因为foo仅仅是function() { /* code */ }这个表达式的一个引用 var foo = function(){ /* code */ } // ...是不是意味着后面加个括弧都可以自动执行？ function(){ /* code */ }(); // SyntaxError: Unexpected token (// 上記のコードは、たとえ実行されても、2 番目のコードはエラーになります。これは、パーサーがグローバル関数または関数の内部関数キーワードを解析するときに発生するためです。 , デフォルトでは、関数式ではなく関数宣言が考慮されます。コンパイラーに明示的に指示しない場合、関数宣言には名前が必要であるため、デフォルトで名前のない関数が使用され、構文エラー メッセージがスローされます。 。

興味深いことに、上記の間違ったコードに名前を追加した場合でも、構文エラーが表示されますが、その理由は上記とは異なります。式の後に括弧 () を追加すると式がすぐに実行されますが、ステートメントの後に括弧 () を追加すると、単なるグループ化演算子にすぎません。

// 下面这个function在语法上是没问题的，但是依然只是一个语句// 加上括号()以后依然会报错，因为分组操作符需要包含表达式 function foo(){ /* code */ }(); // SyntaxError: Unexpected token ) // 但是如果你在括弧()里传入一个表达式，将不会有异常抛出// 但是foo函数依然不会执行function foo(){ /* code */ }( 1 ); // 因为它完全等价于下面这个代码，一个function声明后面，又声明了一个毫无关系的表达式： function foo(){ /* code */ } ( 1 ); 上記の問題を解決するには、中括弧を使用してすべてのコードを囲むだけで済みます。そのため、この時点では、パーサーは を使用して解析を行っています。 function キーワードを指定すると、対応するコードは関数宣言ではなく関数式に解析されます。

// 下面2个括弧()都会立即执行(function () { /* code */ } ()); // 推荐使用这个(function () { /* code */ })(); // 但是这个也是可以用的// 由于括弧()和JS的&&，异或，逗号等操作符是在函数表达式和函数声明上消除歧义的// 所以一旦解析器知道其中一个已经是表达式了，其它的也都默认为表达式了// 不过，请注意下一章节的内容解释var i = function () { return 10; } ();true && function () { /* code */ } ();0, function () { /* code */ } ();// 如果你不在意返回值，或者不怕难以阅读// 你甚至可以在function前面加一元操作符号!function () { /* code */ } ();~function () { /* code */ } ();-function () { /* code */ } ();+function () { /* code */ } ();// 还有一个情况，使用new关键字,也可以用，但我不确定它的效率// new function () { /* code */ }new function () { /* code */ } () // 如果需要传递参数，只需要加上括弧() 上記の括弧は曖昧さを解消するために使用されており、本来は関数式であることが想定されているため、実際にはまったく必要ありませんが、主に開発者が読みやすいようにするために依然として使用されています。これらの自動的に実行される式が変数に割り当てられると、括弧 ( ( ( の先頭) が表示されます。これは、括弧があるかどうかを確認するためにコードを最後まで引っ張らなくてもすぐに理解できます。

こここの記事では、自己実行関数を、正確には自己実行匿名関数 (Self-executing anonymous function) と呼んでいますが、英語の原文の著者は常に、Immediately- という名前の使用を主張してきました。呼び出し関数式。著者は説明するためにたくさんの例をあげました。それでは、見てみましょう:

// 这是一个自执行的函数，函数内部执行自身，递归function foo() { foo(); }// 这是一个自执行的匿名函数，因为没有标示名称// 必须使用arguments.callee属性来执行自己var foo = function () { arguments.callee(); };// 这可能也是一个自执行的匿名函数，仅仅是foo标示名称引用它自身// 如果你将foo改变成其它的，你将得到一个used-to-self-execute匿名函数var foo = function () { foo(); };// 有些人叫这个是自执行的匿名函数（即便它不是），因为它没有调用自身，它只是立即执行而已。(function () { /* code */ } ());// 为函数表达式添加一个标示名称，可以方便Debug// 但一定命名了，这个函数就不再是匿名的了(function foo() { /* code */ } ());// 立即调用的函数表达式（IIFE）也可以自执行，不过可能不常用罢了(function () { arguments.callee(); } ()); (function foo() { foo(); } ());// 另外，下面的代码在黑莓5里执行会出错，因为在一个命名的函数表达式里，他的名称是undefined// 呵呵，奇怪(function foo() { foo(); } ()); ここでのいくつかの例が、自己実行とは何か、即時呼び出しとは何かを皆さんに理解してもらえることを願っています。まだ少し理解できたばかりです。理論万歳です)

次に、limlimlim は モジュール モード についても話しました。これは、将来学ぶ必要がある重要なことです。もちろん、クロージャがあります。この前に (頭でっかち)

例をお見せしましょう

// 创建一个立即调用的匿名函数表达式// return一个变量，其中这个变量里包含你要暴露的东西// 返回的这个变量将赋值给counter，而不是外面声明的function自身var counter = (function () {var i = 0;return { get: function () {return i; }, set: function (val) { i = val; }, increment: function () {return ++i; } }; } ());// counter是一个带有多个属性的对象，上面的代码对于属性的体现其实是方法counter.get(); // 0counter.set(3); counter.increment(); // 4counter.increment(); // 5counter.i; // undefined 因为i不是返回对象的属性i; // 引用错误: i 没有定义（因为i只存在于闭包）