面试题：JavaScript 控制流语句在异步场景下的优化运用

Question

假设你有一个函数 `fetchData`，它返回一个 Promise，模拟异步获取数据操作。现在有多个这样的异步操作需要依次执行，并且每个操作依赖前一个操作的结果。请使用 JavaScript 的控制流语句（结合 `async/await` 或 `Promise` 相关特性）实现一个函数 `executeTasks`，确保所有任务按顺序执行，若其中某个任务失败，则终止后续任务并捕获错误，同时要处理好内存管理和性能优化问题。请详细阐述你的设计思路，并给出完整的代码实现。

Answer 1

设计思路

1. 使用 async/await 语法糖来处理异步操作，因为它使异步代码看起来更像同步代码，易于理解和维护。
2. 在 executeTasks 函数内部创建一个数组来存储每个 fetchData 任务。
3. 使用 for...of 循环遍历任务数组，在每次循环中，await 前一个任务的结果，并将其作为参数传递给下一个 fetchData 任务。
4. 通过 try...catch 块捕获任何一个任务执行过程中抛出的错误，如果捕获到错误，终止后续任务的执行，并将错误传递出去。
5. 关于内存管理和性能优化：
   • 及时释放不再使用的变量，例如在每个 fetchData 任务完成后，相关的中间变量（如果有）会随着函数执行结束而被垃圾回收机制回收。
   • 由于是顺序执行任务，不存在过多并发任务导致的资源竞争问题，在一定程度上也优化了性能。

代码实现

function fetchData(data) {
    return new Promise((resolve, reject) => {
        // 模拟异步操作
        setTimeout(() => {
            if (Math.random() > 0.5) {
                resolve(data + ' processed');
            } else {
                reject(new Error('fetchData failed'));
            }
        }, 1000);
    });
}

async function executeTasks() {
    const tasks = [1, 2, 3, 4];// 示例任务数据
    let result;
    try {
        for (const task of tasks) {
            result = await fetchData(result? result : task);
            console.log(result);
        }
        return result;
    } catch (error) {
        console.error('任务执行失败:', error);
        throw error;
    }
}

executeTasks().catch(console.error);