Проверьте правильность загрузки Javascript

Question

У меня есть 10 файлов js. Я загружаю весь файл перед загрузкой класса java. Но мне нужно проверить, что все файлы загружены правильно, и я вызываю свой класс java.

Во-первых, я вызываю один файл js, который загружает все необходимые файлы js, здесь мне нужно проверить, что все мои 10 js-файлы загружены правильно, тогда мне нужно вызвать одну функцию.

вот мой код

loadpackage("0.js",callback); 
loadpackage("1.js",callback); 
loadpackage("2.js",callback); 
loadpackage("3.js",callback); 
loadpackage("4.js",callback); 
loadpackage("5.js",callback); 
loadpackage("6.js",callback); 
loadpackage("7.js",callback); 
loadpackage("8.js",callback); 
loadpackage("9.js",callback); 
loadpackage("10.js",callback); 


function loadpackage(path, callback) { 

    var done = false; 
    var scr = document.createElement('script'); 

    scr.onload = handleLoad; 
    scr.onreadystatechange = handleReadyStateChange; 
    scr.onerror = handleError; 
    scr.src = path; 
    document.body.appendChild(scr); 

    function handleLoad() { 
     if (!done) { 
      done = true; 
      callback(path, "ok"); 
     } 
    } 

    function handleReadyStateChange() { 
     console.log("readystate1"); 
     var state; 

     if (!done) { 
      console.log("readystate2"); 
      state = scr.readyState; 
      console.log("readystate3"); 
      if (state === "complete") { 
       console.log("readystate4"); 
       handleLoad(); 
      } 
     } 
    } 
    function handleError() { 
     if (!done) { 
      done = true; 
      callback(path, "error"); 
     } 
    } 
} 

function callback(path, message) { 
    console.log(path+" :: "+message); 
} 

Некоторые где я читал, что onreadystatechange событие говорит о том, что файлы успешно загружены, но здесь onreadystatefunction не называется.

Так что, пожалуйста, помогите мне решить эту проблему, как проверить, что мои все 10 js-файлов загружены правильно.

Некоторые вопросов ответить эту проблему с помощью JQuery, но я не могу использовать JQuery, мне нужен ответ на JavaScript или GWT

Framework: GWT 2.6.0
Я работаю на GWT, в котором используется Java Class & для выполнения некоторых операций Мне нужно загрузить файлы js

Answer 1

Создать счетчик, а затем уменьшить его каждый раз onload callback fire. Когда он достигнет 0, сделайте то, что вам нужно.

var scripts = ['1.js', '2.js', ...] 
var scriptsToLoad = scripts.length 

scripts.forEach(loadScript) 

function loadScript (path) { 
    var scr = document.createElement('script') 

    scr.onload = function() { 
    scriptsToLoad -= 1 

    if (scriptsToLoad === 0) doYourJavaThing() 
    } 

    scr.src = path 
    document.body.appendChild(scr) 
} 

function doYourJavaThing() { 
    // la la la 
} 

Answer 2

Как я вижу, вам придется использовать Promise в этом случае означает, что ваша функция, которая загружает скрипт будет очень удобно возвращаться обещание, как это:

//Change your function to this: 
function loadpackage(path, resolve, reject) { 

    var done = false; 
    var scr = document.createElement('script'); 

    scr.onload = handleLoad; 
    scr.onreadystatechange = handleReadyStateChange; 
    scr.onerror = handleError; 
    scr.src = path; 
    document.body.appendChild(scr); 

    function handleLoad() { 
     if (!done) { 
      done = true; 
      resolve({ path:path,status:'ok' }); 
     } 
    } 

    function handleReadyStateChange() { 
     console.log("readystate1"); 
     var state; 

     if (!done) { 
      console.log("readystate2"); 
      state = scr.readyState; 
      console.log("readystate3"); 
      if (state === "complete") { 
       console.log("readystate4"); 
       handleLoad(); 
      } 
     } 
    } 
    function handleError() { 
     if (!done) { 
      done = true; 
      reject({ path:path,status:'error' }); 
     } 
    } 
} 

//Use promises 


var promises = []; 

promises.push(new Promise(function(resolve,reject){ 

    loadpackage("0.js", resolve, reject) 

})); 
promises.push(new Promise(function(resolve,reject){ 

    loadpackage('path', resolve, reject) 

})); 
promises.push(new Promise(function(resolve,reject){ 

    loadpackage("1.js", resolve, reject) 

})); 

//...etc 

//And finally wait untill all of them are resolved 

Promise.all(promises).then(function(value){ 

    //Here you absolutely know that all files have loaded, 
    //and you can fire callback here for each of them like 

    callbak(value.path, value.status); 

});