Как создать полусинхронное поведение AJAX

Question

Большую часть прошлого месяца я провел, стуча головой о стену, прежде чем нашел простой способ динамической загрузки и объединения в цепочку классов HTML-холста, которые хранятся на сервере, но, очевидно, инициализируются на клиенте.(труднее, чем кажется, когда порядок важен в асинхронной среде).

Мне было интересно, может ли кто-нибудь помочь мне найти способ загрузки простых сценариев JavaScript.Давайте определим функцию load('foo.js'), которая инструктирует клиента загрузить скрипт foo.js с сервера и выполнить его как код JavaScript.

С учетом трех файлов, хранящихся на сервере:

A.js

a = 10;

B.js

load('A.js');
b = a + 10;

C.js

load('B.js');
c = b + 10;

Если клиент выдает команду load('C.js');, какой самый простой / надежный способ реализовать это.У меня была одна идея - отсканировать код на стороне сервера и вернуть все сценарии одновременно.Это требует минимального количества запросов php.Однако, если клиент уже запрашивал C.js ранее, сценарий должен существовать на стороне клиента, и это было бы неэффективно, особенно если C.js и все его зависимые файлы большие.Другой вариант, который я рассмотрел, заключался в том, чтобы обернуть все эти серверные сценарии в объект, например, для C.js выше:

{
  depenencies: ['B.js'] ,
  code : 'c.age = b.age + 10;'
}

Я просто не знаю, как «приостановить» выполнение сценария C.jsпосле оператора load('B.js') и его возобновления после загрузки B.js.

EDIT Спасибо redsqaure за предложение yepnope и requirejs.К сожалению, я не люблю их по нескольким причинам.С одной стороны, requirejs труден (я уверен, что я буду подвергнут критике за это).Моя главная проблема в том, что, если это так трудно освоить, я мог бы также воссоздать его сам, изучая его в процессе и имея больший контроль над ним.Во-вторых, вам нужно изменить свой стиль письма.Переключение в Dojo и необходимость использования dojo.declare("ClassName", [ParentA,ParentB], {...}); для объявления классов - это одно, а перенос каждого фрагмента кода в require(['A','B',...], function(){}); - это другое.Наконец, я не знаю, как просто будет указывать, где искать файлы.Я хочу, чтобы пользователь мог определять переменную серверную часть 'PATH' и выполнять поиск в каждой из папок / подпапок 'PATH'

Answer 1

Почему бы не взглянуть на загрузчик скриптов, например yepnope.js или require.js

Answer 2

Зависит от того, насколько вы хотите оптимизировать его. Либо вы можете пойти по маршруту синхронного XHR, либо использовать обратный вызов (асинхронный и рекомендуемый). Если бы вы пошли вторым путем, ваш код выглядел бы примерно так:

// Say C.js is dependent on A.js and B.js..
load(["A.js","B.js"], function() {       
     // code goes here    
});

EDIT

Взглянув на ваш отзыв, вы можете получить то, что вам нужно, но его было бы хрупко и сложно написать на javascript. Ниже у меня есть пример / непроверенная реализация загрузчика зависимостей, где файл может иметь только один вызов для загрузки ("file.js") возможно. Это было бы более сложным для нескольких возможных зависимостей. Также я предполагаю, что эти файлы поступают из одного домена.

// Usage: load("A.js")
// A.js -> B.js -> C.js
window.load = (function() {

    var loaded = {};

    return function(str, /* internally used */ callback) {

        if(!loaded[str]) {

            loaded[str] = true;

            $.get(str, function(data) {
                var matches = data.match(/load\(['|"](.*)["|']\)/);

                if(matches.length > 1) { // has deps

                    window.load(matches[1], function() {
                        window.eval(data);
                        if(!!callback) callback();
                    });

                } else { // no deps
                    window.eval(data);
                }

            });

        } 
    }
})();