使用promise实现，加载100张图片，每次最多同时加载5张图片

在前端开发中，你可以使用JavaScript的Promise以及并发控制来实现加载100张图片，同时确保每次最多只加载5张图片。以下是一个简单的示例代码，它演示了如何使用Promise来完成这个任务：

// 模拟加载图片的函数，返回一个Promise
function loadImage(url) {
    return new Promise((resolve, reject) => {
        const img = new Image();
        img.onload = () => resolve(img);
        img.onerror = reject;
        img.src = url;
    });
}

// 并发控制函数，确保同时加载的图片数量不超过指定限制
function loadImagesWithConcurrency(urls, maxConcurrency) {
    let currentlyLoading = 0; // 当前正在加载的图片数量
    let loadedImages = []; // 已加载的图片数组
    let index = 0; // urls数组的索引

    const loadNext = () => {
        while (currentlyLoading < maxConcurrency && index < urls.length) {
            currentlyLoading++;
            loadImage(urls[index++]).then(img => {
                loadedImages.push(img);
                console.log(`Loaded image ${img.src}`);
            }).catch(error => {
                console.error(`Failed to load image: ${error}`);
            }).finally(() => {
                currentlyLoading--;
                if (index < urls.length) {
                    loadNext(); // 尝试加载下一张图片
                }
            });
        }
    };

    loadNext(); // 开始加载图片

    return new Promise(resolve => {
        // 当所有图片都尝试加载后，解决这个Promise
        if (urls.length === 0) {
            resolve(loadedImages);
        } else {
            const checkIfFinished = () => {
                if (currentlyLoading === 0) {
                    resolve(loadedImages);
                } else {
                    setTimeout(checkIfFinished, 100); // 等待一段时间后再次检查
                }
            };
            checkIfFinished();
        }
    });
}

// 使用示例：加载100张图片，每次最多加载5张
const imageUrls = Array.from({ length: 100 }, (_, i) => `https://example.com/image${i}.jpg`);
loadImagesWithConcurrency(imageUrls, 5).then(images => {
    console.log('All images loaded', images);
});

这个示例代码定义了两个主要的函数：loadImage和loadImagesWithConcurrency。loadImage函数模拟了加载单张图片的过程，并返回一个Promise。loadImagesWithConcurrency函数则负责并发控制，它使用Promise来确保在任何时候都不会有超过指定数量的图片正在加载。当所有图片都尝试加载后，它会解决并返回一个包含所有已加载图片的数组。