Javascript 使用承诺等待调用函数并完成它假设的操作，然后继续

我正在调用一个函数来加载一些文件，这个函数也在其他地方被调用

要使这段代码成功运行，必须在

我想要实现的是，为了让这个调用完成加载

searchconfig.js

，然后继续其他代码，如果发生错误，则记录它：

loadRemoteFile("Search/" + Search.Configuration.PathToConfigurable + "/Configurable/searchconfig.js");

完整代码：

---

也许您希望loadRemoteFile返回一个承诺

function loadRemoteFile(filename, loadIntoHeader){ 
    return new Promise(function(resolve, reject) {
        filetype = filename.match(".css") ? "css" : "js";

        if (filetype=="js"){ 
            if(!loadIntoHeader){
                var script   = document.createElement("script");
                script.type  = "text/javascript";
                script.src   = filename;
                script.onload = resolve;
                script.onerror = reject;
                document.body.appendChild(script);
            }else{
                // mystery code
            }           
        } else {
            // more mystery code
        }
    }
}

使用：

替代用途（这也使用上面的“promisified”

loadRemoteFile

）

$(document).ready(function () {
    (async function() {
        // place **ALL** your code inside the IIFE inside .ready callback
        if (Search.Configuration && Search.Configuration.PathToConfigurable) {
            // the file that is necessary for the code to run successfully
            try {
                await loadRemoteFile("Search/" + Search.Configuration.PathToConfigurable + "/Configurable/searchconfig.js");
            } catch(error) {
                // do your error handling here
            }
        }
        // execution here starts after the above loadRemoteFile finishes
        // or the condition is false
    })();
});

---

第一件事：您的loadRemoteFile函数需要将承诺返回给调用函数（或者您也可以使用回调函数），以确保调用函数的post脚本仅在loadRemoteFile加载完脚本后执行。因此，如下所示：

var filesList = {};

function loadRemoteFile(filename, callback) {
 if(filesList[filename]) {
  callback();
 }else {
  filesList[filename] = true;
  filetype = filename.match(".css") ? "css" : "js";

        if (filetype=="js"){ 
            if(!loadIntoHeader){
                var script   = document.createElement("script");
                script.type  = "text/javascript";
                script.src   = filename;
                script.onload = resolve;
                script.onerror = reject;
                document.body.appendChild(script);
            }else{
                // mystery code
            }           
        } else {
            // more mystery code
        }
  callback();
 }
}

现在，在函数中，始终使用回调函数调用loadRemoteFile函数

$(document).ready(function() {
 loadRemoteFile('config-file-path', function() {
 }
})

---

一个改进是在请求文件的已加载脚本列表中签入，而不是维护一个文件名数组。但这都是代码优化的一部分；我希望这能给您一个想法。

我最终使用的是等待文件加载

我想要实现的是完成加载

searchconfig.js

，然后继续其他代码：

 function when_external_loaded(callback) {
        // means searchconfig.js is loaded,
        // we should restrict the number of times we check 
        // if the parameter exist or restrict the max time for checking it
        if (typeof x.pagesToAvoid === 'undefined') {
            setTimeout(function () {
                when_external_loaded(callback);
            }, 10); // wait 10 ms
        } else { callback(); }
    }

然后在：

(document).ready(function(){
    when_external_loaded(function () {
     // place all the code that you want to occur after the file has been loaded
    }
});

只有当

x.pagesToAvoid！=='undefined'）

意味着

searchconfig.js

已加载时，才会发生这种情况，因为它将加载调用回调函数的函数

请记住，您应该限制检查文件存在的时间，因为如果文件不存在，这将永远尝试（对我来说没关系，因为文件的存在不依赖于任何东西，他将在那个地方）

我没有使用

承诺

解决方案，因为我误解了一些东西。

承诺仅在发生时返回true，否则返回false。
因此，当尝试加载文件（但尚未加载到内存）时，
承诺将为真。。对我来说，这还不够。
最简单的方法是在调用之前将脚本包含在HTML中。当你有
$（）
或
document.ready
脚本将在执行任何操作之前加载。您是否考虑过使用CDN？该脚本实际上是CDN中的脚本。你说“最简单的方法是在调用之前将脚本包含在HTML中”是什么意思@N.Ivanov AFAIU OP需要条件加载。因此，在本例中，
script
标记不是一个选项，
我试图实现一个带有承诺的解决方案
-不，因为您根本没有在代码中使用承诺，所以，您没有真正尝试使用promises@E.Meir在异步进程完成之前，任何东西都不能阻止函数调用。承诺只是通过回调来简化等待。是的，我想要-其他代码呢？我怎么称呼它？我如何等待承诺成功运行？如果发生了什么事情，我如何捕获错误？@E.Meir-添加usagei我在控制台中收到警告-“h1.js:25警告：承诺因无错误而被拒绝”当我单击此警告时-它将我引用“…config.js”）。然后（函数。。。“在Visual studio中，在
loadRemoteFile
函数中-在最后一个
}
中有一个减弱，表示
（JS）'，“您发布的代码中预期的
返回新承诺（
”（“未关闭”）
$(document).ready(function() {
 loadRemoteFile('config-file-path', function() {
 }
})

 function when_external_loaded(callback) {
        // means searchconfig.js is loaded,
        // we should restrict the number of times we check 
        // if the parameter exist or restrict the max time for checking it
        if (typeof x.pagesToAvoid === 'undefined') {
            setTimeout(function () {
                when_external_loaded(callback);
            }, 10); // wait 10 ms
        } else { callback(); }
    }

(document).ready(function(){
    when_external_loaded(function () {
     // place all the code that you want to occur after the file has been loaded
    }
});