1. ホーム
  2. javascript

[解決済み] JavaScriptの(function() { } )()構文とは何ですか?

2022-03-19 08:12:50

質問

以前はこの意味が分かっていたのですが、今は悩んでいます...。

これは基本的に document.onload ?

(function () {

})();

解決方法は?

それは 即座に呼び出される関数式 または IIFE を省略したものです。作成後すぐに実行されます。

のような)イベントのイベントハンドラとは何の関係もない。 document.onload ).
最初の括弧の中の部分を考えてみましょう。 (function(){})(); ...これは正規の関数表現です。次に、最後のペアを見ます。 (function(){})(); これは、通常、関数を呼び出すための式に追加されます。

このパターンは、グローバル名前空間の汚染を避けようとする場合によく使われます。なぜなら、IIFEの内部で使用されるすべての変数(他のすべての 通常の 関数)は、そのスコープの外からは見えません。
のイベントハンドラと混同しているのは、このためかもしれません。 window.onload このように使われることが多いからです。

(function(){
  // all your code here
  var foo = function() {};
  window.onload = foo;
  // ...
})();
// foo is unreachable here (it’s undefined)

修正提案 グーファ :

関数は、パースされた後ではなく、作成された直後に実行されます。スクリプトブロック全体は、その中のコードが実行される前にパースされます。また、コードがパースされたからといって自動的に実行されるわけではありません。例えばIIFEが関数の中にある場合、その関数が呼び出されるまで実行されることはありません。

更新 これはかなりポピュラーなトピックなので、IIFEの書き方として ES6のarrow関数 (例えば ガジューム ご指摘の通り コメントで ) :

((foo) => {
 // do something with foo here foo
})('foo value')