分批次处理海量数据

在处理海量数据时，使用 setTimeout 分批次处理可以避免阻塞主线程，提升页面响应性。以下是分步骤的解决方案和代码示例：

方法思路

1. ‌数据分块‌：将大数据拆分成多个小批次（如每批100条）。

2. ‌异步处理‌：使用 setTimeout 在每批次处理结束后，让出主线程执行其他任务。

3. ‌递归调用‌：处理完当前批次后，递归调用下一批次处理，直到完成。

function processInBatches({ data, batchSize, processBatch, onFinish }) {    let currentIndex = 0;    function nextBatch() {        if (currentIndex >= data.length) {            if (onFinish) onFinish();            return;        }        // 获取当前批次数据        const batch = data.slice(currentIndex, currentIndex + batchSize);        // 处理当前批次        processBatch(batch, currentIndex);        currentIndex += batchSize;        // 使用 setTimeout 启动下一批次        setTimeout(nextBatch, 0);    }    // 开始处理    nextBatch();}// 使用示例const largeData = Array.from({ length: 10000 }, (_, i) => i); // 模拟1万条数据processInBatches({    data: largeData,    batchSize: 100, // 每批处理100条    processBatch: (batch) => {        console.log('处理批次:', batch);        // 这里执行实际的数据处理逻辑        batch.forEach(item => {            // 处理每条数据，例如更新DOM或进行计算        });    },    onFinish: () => {        console.log('所有数据处理完成！');    }});