在JavaScript闭包中使用promise与web worker协作

我正在用JavaScript执行一个图像处理操作，该操作按预期工作，但有一件事是它有时会冻结UI，这使得我使用WebWorker来执行图像处理功能。 我有一个场景需要处理多个。下面是我用来实现上述壮举的工作流摘要

//closure
var filter = (function(){
    function process(args){
         var promise = new Promise(function (resolve, reject) {
            if (typeof (Worker) !== "undefined") {
                if (typeof (imgWorker) == "undefined") {
                    imgWorker = new Worker("/processWorker.js");
                }
                imgWorker.postMessage(args);
                imgWorker.onmessage = function (event) {
                    resolve(event.data);
                };
            } else {
                reject("Sorry, your browser does not support Web Workers...");
            }
        });
        return promise;
    }
return {
        process: function(args){
            return process(args);
       }
 }
})(); 

function manipulate(args, callback){
    filter.process(args).then(function(res){
        callback(res);
    });
}

在这里，我加载多个图像并将它们传递到操纵函数中。 在这个场景中，我面临的问题是，有时候，对于一些图片，承诺永远不会得到解决。 调试完代码后，我发现这是因为我正在为一个映像创建一个承诺，而之前的承诺没有得到解决。 我需要关于如何解决此问题的建议，同时我还有另一个问题，我是否应该多次使用同一个闭包（在上述场景中使用过滤器），或者在需要时每次创建新闭包，如下所示：

var filter = function(){
      ....
    return function(){}
    ....

} 

function manipulate(args, callback){
    var abc = filter();
    abc.process(args).then(function(res){
        callback(res);
    });
}

---

我希望我的问题是清楚的，如果不是，请发表评论。

更好的方法是只加载一次图像处理

工作者。在应用程序启动期间或需要时

之后，您可以仅为希望从工作者调用的函数创建承诺。在您的情况下，
filter
可以在每次向
工作者发布时返回一个新的
Promise
对象。仅当从特定函数调用的工作方收到答复时，才应解析此承诺对象

您的代码所发生的事情是，即使
onmessage
处理程序正在处理来自工作者的不同消息，您的承诺仍在解决。例如，如果你向员工发布2次。如果第二篇文章返回一条消息，它会自动解析两个promise对象

我在这里创建了一个worker封装。虽然它可能无法开箱即用，因为我没有清除它内置的一些依赖项。请随意使用我应用的方法

其他：
您需要将您的
帖子
和
onmessage
映射到您的
承诺
。这也需要您修改工作代码


//
让generateID=函数（args）{
//从您的args生成一个ID。或者找到一种独特的方式来区分您的承诺。
返回id；
}
让承诺={}
//如果愿意，可以将此对象添加到过滤器对象中。但我暂时把它放在这里了
//关闭
变量过滤器=（函数（）{
函数进程（args）{
let id=generateID（args）
承诺[id]={}
承诺[id]。承诺=新承诺（函数（解析、拒绝）{
如果（工人类型）！=“未定义”）{
if（类型（imgWorker）=“未定义”）{
imgWorker=newworker（“/processWorker.js”）；
imgWorker.onmessage=函数（事件）{
let id=generateID（event.data.args）//让您的工作人员返回args，以便您可以检查您创建的承诺的id。
//只解决你需要解决的承诺
承诺[id].resolve（event.data）；
}    
//您不需要一直为onmessage分配函数。
}
imgWorker.postMessage（args）；
//您可以在对象中保存所有相关的内容。
承诺[id]。解析=解析
承诺[id]。拒绝=拒绝
承诺[id]。args=args
}否则{
拒绝（“对不起，您的浏览器不支持Web Workers…”）；
}
});
//返还相关承诺
退货承诺[id]。承诺；
}
返回{
进程：函数（args）{
返回过程（args）；
}
}
})(); 
函数操作（参数、回调）{
filter.process（args）.then（function（res）{
回收（res）；
});
}
更好的方法是只加载一次图像处理
工作者。在应用程序启动期间或需要时

之后，您可以仅为希望从工作者调用的函数创建承诺。在您的情况下，
filter
可以在每次向
工作者发布时返回一个新的
Promise
对象。仅当从特定函数调用的工作方收到答复时，才应解析此承诺对象

您的代码所发生的事情是，即使
onmessage
处理程序正在处理来自工作者的不同消息，您的承诺仍在解决。例如，如果你向员工发布2次。如果第二篇文章返回一条消息，它会自动解析两个promise对象

我在这里创建了一个worker封装。虽然它可能无法开箱即用，因为我没有清除它内置的一些依赖项。请随意使用我应用的方法

其他：
您需要将您的
帖子
和
onmessage
映射到您的
承诺
。这也需要您修改工作代码


//
让generateID=函数（args）{
//从您的args生成一个ID。或者找到一种独特的方式来区分您的承诺。
返回id；
}
让承诺={}
//如果愿意，可以将此对象添加到过滤器对象中。但我暂时把它放在这里了
//关闭
变量过滤器=（函数（）{
函数进程（args）{
let id=generateID（args）
承诺[id]={}
承诺[id]。承诺=新承诺（函数（解析、拒绝）{
如果（工人类型）！=“未定义”）{
if（类型（imgWorker）=“未定义”）{
imgWorker=newworker（“/processWorker.js”）；
imgWorker.onmessage=函数（事件）{
let id=generateID（event.data.args）//让您的工作程序返回args