Question

我有一个对象数组，每个对象都有一些属性，每个属性都包含一个图像的URL。

我有更多数组，我想下载所有这些图像，所以我使用fetch()承诺。 Promise.all()接受一组promise，所以我为每个属性运行Promise.all()，因为我不想拥有一个包含所有属性的所有承诺的数组。

但是......我必须手动编写所有这些吗？我知道我不能用于循环。或者我是否必须使用递归（如果在这种情况下可能），每次使用新数组从内部调用函数？

编辑：用例

//first I build arrays for promises
// var results is an array of arrays that contain objects -> results[i]Items[k].property

var items_offline_img = [];

for (var i = results.length - 1; i >= 0; i--) {

    for (var k = results[i].Items.length - 1; k >= 0; k--) {
        var images = new Object();
        images.Src = results[i].Items[k].Src;
        images.Src2 = results[i].Items[k].Src2;
        images.Src3 = results[i].Items[k].Src3;

        items_offline_img.push(images);
    }
}

// Now I have to make Promise.all() for every items_offline_img[i].Src, and then for Src2 and so on.


// Promise block


var promises = [];

for (var i = items_offline_img.length - 1; i >= 0; i--) {
    promises.push(fetch(items_offline_img[i].Src));

}

Promise
    .all(promises)
    .then(function(response) {
        var blobs = [];
        for (var i = response.length - 1; i >= 0; i--) {
            var blb = response[i].blob();
            blobs.push(blb);
        }
        return Promise.all(blobs);
    })
    .then(function(blobsPromise) {
        var urlCreator = window.URL || window.webkitURL;
        for (var i = blobsPromise.length - 1; i >= 0; i--) {
            lcl_images[i].value = urlCreator.createObjectURL(blobsPromise[i]);
        }

        setItem();

    })
    .catch(function(error) {
        console.log(error);
    });

现在我要为Src2，Src3等手动编写额外的Promise块吗？

好的我只能用1个阵列获取所有图像，但我必须在blob中转换图像并将它们与localForage一起存储。

通过这种方式，只有1个数组，在.then(function(blobsPromise)我不知道图像所引用的项目。

解决方法：我只能使用图像复制数组结构。像

replicate_Items[i].Src 
replicate_Items[i].Src2
repliacte_Items[i].Src3

replicate_Items[i].Src中的replicate_Items[i].Src2，replicate_Items[i].Src3，blobsPromise[i]，blobsPromise[i+1]，blobsPromise[i+2]

.then(function(blobsPromise) {

    var urlCreator = window.URL || window.webkitURL;
    var images_num = Object.keys(replicate_Items[0]).length;
    var current_image_num = 0;
    var k = 0; // replicate_Items[k]
    var objectURL;

    for (var i = blobsPromise.length - 1; i >= 0; i--) {

        objectURL = urlCreator.createObjectURL(blobsPromise[i]);

        if (current_image_num == 1)
            replicate_Items[k].Src = objectURL;
        if (current_image_num == 2)
            replicate_Items[k].Src2 = objectURL;
        if (current_image_num == 3)
            replicate_Items[k].Src3 = objectURL;

        current_image_num++;
        if (current_image_num = images_num) {
            current_image_num = 1;
            k++;
            images_num = Object.keys(replicate_Items[k]).length;
        }
    }

    setItem();

})

您怎么看？

Answer 1

可以使用属性访问器遍历Src属性列表来创建平面承诺列表。

// Promise block

var jList = ['Src','Src1','Src2'];
var promises = [];

for (var j=0; j < jList.length; j++) {
    var jSrc = jList[j];
    for (var i = items_offline_img.length - 1; i >= 0; i--) {
         promises.push(fetch(items_offline_img[i][jSrc]));
    };
};

上面的示例使用嵌套的for循环来创建图像承诺的平面列表。请注意使用property accessor来遍历源属性列表。

多个Promise.all（）因为有多个数组

1 个答案: