превратить массив в функцию, делая загрузчик javascript с помощью jquery - PullRequest
4 голосов
/ 11 августа 2011

как мы можем сделать функцию из массивов типа

$.loader({
    js: [
        ['1.js','3.js','2.js'], 
        ['4.js'], 
        ['5.js'] 
    ]
}); 

во что-то, что делает

$.when(
    $.getScript("1.js"),
    $.getScript('3.js'),
    $.getScript('2.js'))
    .then(
        function(){
            $.getScript('4.js').then(function(){
                $.getScript('5.js');
            })
        });

вот что я сейчас работаю над

loader: function(arg){
    var js = arg;
    var phase = 0;
    for (var i = 0; i < o.length; i++) {
        console.log(o[i]);
        $.each(o[i], function(key,src) {
            //append javascript
        });
    };
}

enter image description here

проблема в том, что я не знаю, с чего начать. вот что я имею в виду

  1. Я делю их на фазы.
  2. установить фазу 0, он запустит первый массив, но как я могу это сделать? $.getScript(src) для каждого стека. или цепь. может быть, поставить один вар жало? как string + = $.getScript(src)., так что это будет похоже на $.getScript("1.js").getScript("3.js").getScript("2.js"), пока не будет массив строк, который в этом примере равен 3. затем сделайте что-то вроде добавления $.when( перед строкой, затем в конце строки поместите .then(function(){ до конца, затем каким-то образом закройте строку.
  3. хорошо, я не знаю (и здесь идет пост в stackoverflow)

Ответы [ 3 ]

1 голос
/ 11 августа 2011

Просто чтобы прояснить, вы сами пишете о решении, которое загружает кучу скриптов?Если это так, не делайте этого сами.Встаньте на чужие плечи.

RequireJS уже делает то, что вы просите.http://requirejs.org/

В нем даже есть документация для использования с jQuery.http://requirejs.org/docs/jquery.html

Кто-то уже проделал тяжелую работу, написал и протестировал хороший продукт.Сэкономьте время и стресс.

1 голос
/ 11 августа 2011

Надеюсь, это то, что вы имеете в виду: http://jsfiddle.net/pimvdb/hdN3Q/1/.

(function($) {
    function load(files, index) {
        var arr = [];

        // fill arr with getScript requests (fake here)
        for(var i = 0; i < files[index].length; i++) {
            arr.push(console.log(files[index][i]));
        }

        // call $.when with arr as array of arguments (using apply)
        $.when.apply(null, arr).then(function() {
            if(index < files.length - 1) {
                // if we have to move to the next chunk,
                // load that next one
                setTimeout(function() {
                    // timeout is to show they get processed in chunks
                    load(files, index + 1);
                }, 1000);
            }
        });
    }

    $.loader = function(obj) {
        load(obj.js, 0);
    }
})(jQuery);

$.loader({
    js: [
        ['1.js','3.js','2.js'], 
        ['4.js'], 
        ['5.js'] 
    ]
});

.apply по сути делает то же самое, что и вызов функции. Однако, поскольку количество аргументов для $.when различается в зависимости от ввода, вы не можете просто вызвать $.when(...), потому что у вас нет фиксированного количества аргументов. Для вызова функции с переменным количеством аргументов используется .apply. Это работает так:

someFunction(1, 2, 3);

невероятно похож на:

someFunction.apply(null, [1, 2, 3]);

(null относится к контексту выполнения, находящемуся вне области действия.) Самое замечательное в этом то, что вы можете создать массив любого размера. Таким образом, вы можете вызвать функцию с любым переменным количеством аргументов таким образом.

В функции load arr заполняется функциями getScript и работает так же:

var arr = [getScript('file1'), getScript('file2')];
$.when.apply(null, arr);

невероятно похож на:

$.when(getScript('file1'), getScript('file2'));

В load мы заполняем arr файлами чанка, например, в вашем случае первый блок равен 1.js, 3.js и 2.js. Это делается с помощью цикла for, но массив, который вы в итоге получите, можно просто передать в .apply.


Когда все файлы загружены, вызывается .then. Функция, которую мы передаем туда, должна загружать следующий фрагмент, но только если равен следующему фрагменту. Если есть 3 блока, он должен перейти к следующему, когда index равно 0 или 1. Когда чанк 2 закончен, следующего чанка нет, поэтому он не должен переходить к следующему, так как следующего нет.

Итак, нам нужно это if предложение:

if(index < files.length - 1) {

Скажите files.length - это 3. Тогда это if условие будет проходить только тогда, когда index равно 0 или 1, что мы и хотим.

1 голос
/ 11 августа 2011
function lScripts(startAt){
for (var i = startAt; i < js.length; i++) {    
    if (js[i].constructor == Array){
        for (var j = 0; j < js[i].length; j++) {
            if(j==js[i].length){
                $.getScript('js[i][j]',function(){
                    lScripts(startAt+1);
                });
            }else{
                $.getScript('js[i][j]');
            }

        }

    }else{
         $.getScript('js[i]',function(){
            lScripts(startAt+1);
         });

    }
}
}

lScripts(0);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...