面试题：JavaScript中生成器与迭代器在数据处理场景的应用

Question

假设你有一个包含大量数字的数组，现在需要对这些数字进行一系列处理，如过滤掉负数、平方每个数字，最后求总和。请使用JavaScript的生成器与迭代器来实现这个功能，并解释你的实现思路。

Answer 1

实现代码

function* numberGenerator(arr) {
    for (let num of arr) {
        yield num;
    }
}

function filterNegative(num) {
    return num >= 0;
}

function square(num) {
    return num * num;
}

function sum(arr) {
    return arr.reduce((acc, val) => acc + val, 0);
}

const largeArray = [-1, 2, -3, 4, -5, 6];
const gen = numberGenerator(largeArray);
const filtered = Array.from(gen).filter(filterNegative);
const squared = filtered.map(square);
const total = sum(squared);

console.log(total);

实现思路

1. 生成器函数 numberGenerator：
   • 定义一个生成器函数 numberGenerator，它接受一个数组作为参数。
   • 使用 for...of 循环遍历数组，并通过 yield 逐个返回数组中的元素，这样可以按需求产生值，而不是一次性处理整个数组，节省内存。
2. 过滤函数 filterNegative：
   • 定义一个简单的过滤函数 filterNegative，用于判断一个数字是否为非负数。
3. 平方函数 square：
   • 定义一个函数 square，用于将输入数字进行平方操作。
4. 求和函数 sum：
   • 使用 Array.prototype.reduce 方法定义一个求和函数 sum，它将数组中的所有元素累加起来。
5. 处理流程：
   • 首先创建一个生成器实例 gen，传入包含大量数字的数组 largeArray。
   • 使用 Array.from(gen) 将生成器转换为数组，然后使用 filter 方法过滤掉负数。
   • 对过滤后的数组使用 map 方法对每个数字进行平方操作。
   • 最后使用 sum 函数计算平方后数组的总和，并输出结果。通过这种方式，利用生成器与迭代器的特性，逐步处理大量数据，避免一次性加载所有数据到内存中，提高性能和内存使用效率。