新しいクラスのIIFE関数がwebpackと連携しています

この関数があります。私はこのjsファイルの外から新しいテスト（セレクタ、{}）を取得しようとしていますが、それは未定義となり、なぜその理由が分からないようです。新しいクラスのIIFE関数がwebpackと連携しています

本当にウィンドウオブジェクトにアタッチする必要がありますか？誰かがこれを説明できますか？

これは、同じファイルから動作すると言えます。私ははっきりと何をしているかのWebPACK誤解た

module.exports = { 
entry: './src/test.js', 
module: { 
    loaders: [ 
    { 
     test: /\.js?$/, 
     exclude:/(node_modules) /, 
     loader: 'babel-loader', 
     query: { 
     presets: ['es2015', 'stage-0'] 
     } 
    } 
    ] 
}, 
output: { 
    path: __dirname + '/src', 
    filename: 'test.min.js' 
} 
}

出典

2016-05-22 Anonymous

IIFEはまだ機能しており、関数はグローバルスコープとは無関係の独自のスコープを持っています。関数スコープで宣言された変数は、関数の実行が終了すると消滅します。 IIFEの後にそれを残しておきたいなら、それを関数の外で宣言するか、クラスの_value_を外部に付ける必要があります。 –

* window *を関数に渡すことは利点がありません。代わりに、グローバルな* this *を使用してください： '（（window、document、undefined）=> {...}）'（this、document） 'は同じオブジェクトブラウザで* this *はグローバルオブジェクトを参照する必要があります。* window *は再割り当て可能でない可能性があります。と矢印関数内では、* this *はグローバルオブジェクトを参照する必要があります。 – RobG

@AkshatMahajan：[Nope]（http://stackoverflow.com/questions/111102/how-do-javascript-closures-work）。 – Bergi

：

let Test = ((window, document, undefined) => { 

    class test { 
    constructor(selector, options) { 
    this.selector = document.querySelector(selector); 
    this.options = options; 
    } 
} 

return test; 

})(window, document);

は、これは私のWebPACKの設定ファイルです。 WebpackはすべてのJavaScriptファイルをグローバル名前空間で利用できないモジュールに変換します。そのため、require/importを使用してロードする必要があります。上記の例では、Test関数はロードされず、定義されていませんでした。 JavaScriptのデフォルトスコープの性質はもはや存在しません。

出典

2016-06-01 07:54:22

新しいクラスのIIFE関数がwebpackと連携しています

答えて

関連する問題