0

そこで、私自身の演習として、ちょっとした非同期スクリプト ローダー ユーティリティ (require.js、head.js、yepnope.js など) を作成していて、ちょっとした難問にぶつかりました。まず、基本的な構文は次のようになります。

using("Models/SomeModel", function() {
  //callback when all dependencies loaded
});

ここで、この呼び出しが行われたときに、自分がどのファイルにいるのかを知りたいと思います。コンテンツがロードされた後にフラグをマークできるように、ajax 呼び出しでそれを行うことができますが、すべてをマークするためにそれを評価する前にusing 呼び出しは特定のファイルに対して行われ、eval の直後にフラグを設定解除します (eval が悪であることは知っていますが、この場合はそもそも json ではなく JavaScript であるため、AS 悪ではありません)。これで必要なものが得られると確信していますが、いくつかの理由から、スクリプトタグを使用してこれを行うことをお勧めします。

  1. 意味的にはより正しいです
  2. デバッグ用のスクリプトを見つけやすくなります (一意のファイル名は、匿名のスクリプト ブロックやデバッガー ステートメントよりもはるかに簡単に調べることができます)。
  3. クロスドメイン リクエスト。XDomainRequest を使用できることはわかっていますが、ほとんどのサーバーはそのように設定されていないため、CDN で外部スクリプトを参照する機能が必要です。

必要なものをほとんど手に入れられるものを試しました。using が呼び出されるたびにリストを保持します。スクリプトの 1 つが読み込まれると、参照を使用しているスクリプトのいずれかを取得して、読み込まれたばかりのファイルの正しいオブジェクトに組み込み、グローバル リストをクリアします。これは実際には Firefox と Chrome では問題なく動作するように見えますが、IE では失敗します。これは、読み込みイベントが奇妙なタイミングで発生するように見えるためです (jQuery 参照が別の型への参照を飲み込み、最終的に依存関係として表示されます)。「インタラクティブな」readystate に取り掛かることができると思っていましたが、実際には発生していないようです。

だから今、ここにいる誰かがこれについて何か考えているかどうか尋ねに来ました。もしよろしければ、コードを投稿できますが、それでも非常に面倒で、おそらく読みにくいでしょう。

編集：追加の使用法

//aliasing and multiple dependencies
using.alias("ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js", "jQuery");

using(["jQuery", "Models/SomeModel"], function() {
  //should run after both jQuery and SomeModel have been loaded and run
});

//css and conditionals (using some non-existant variables here)
using.css({ src: "IEFix", conditionally: browser === "MSIE" && version < 9 });
//should include the IEFix.css file if the browser is IE8 or below

以下の私の回答を詳しく説明するには、これをファイル A と考えてください (そして、以前の jquery エイリアスがまだそこにあると考えてください)。

using(["jQuery", "B"], function() {
  console.log("This should be last (after both jQuery and B have loaded)");
  console.log(typeof($));
});

次に、これは B になります。

using("C", function() {
  console.log("This should be second");
});

そして最後に、C:

console.log("This should be first");

出力は次のようになります。

This should be first
This should be second
This should be last (after both jQuery and B have loaded)
[Object Object]
4

1 に答える 1