JavaScript - 在调用另一个数组的 for-of 循环内从一个数组返回单个值答案

【问题标题】：JavaScript - Return individual values from one array, inside of a for-of loop calling another arrayJavaScript - 在调用另一个数组的 for-of 循环内从一个数组返回单个值
【发布时间】：2021-10-22 03:52:45
【问题描述】：

我从一个函数返回两个值，svcCenterBandssortedBands，并在另一个函数内部的 for of 循环内调用 sortedBands。

svcCenterBands 是 getMileageBand 函数内的对象数组，它返回一个唯一对象数组，这些对象是代表英里范围的字符串值。

const getMileageBand = refSrcData => {
    const mileageBand = refSrcData.data.map(e => e['97']); // Mileage Band Name

    // Reduce the array to only unique values, no repeats
    const svcCenterBands = mileageBand.reduce((unique, i) => {
        if (!unique.some(obj => obj.label === i.label && obj.value === i.value)) {
            unique.push(i);
        }
        return unique;
    }, []);

    // Get only the values from svcCenterBands
    const numberedBands = svcCenterBands
        .map(band => Object.values(band))
        .join()
        .split('-')
        .map(str => str.split(',')[0]);

    // Sort numberedBands in ascending order
    const sortedBands = numberedBands
        .map(Number)
        .sort((first, next) => first - next);

    console.log(svcCenterBands, sortedBands);
    return [svcCenterBands, sortedBands];
};

sortedBands 更进一步，采用svcCenterBands，仅获取它的最后一个值并将其转换为数字并对其进行排序。例如，如果svcCenterBands 返回值["0-30"]，sortedBands 会将该字符串放入数组中并提取连字符后的数字，将其转换为数字并按升序对所有数组值进行排序。

在另一个函数内部，我调用getMileageBand 并通过for of 循环运行sortedBands (getMileageBand(facData)[1])。

    const mileageRanges = getMileageBand(facData)[0];
    const mileageBand = getMileageBand(facData)[1];

    // generate radius for each mileage band, mileage === coordinates
    for (mileage of mileageBand) {
        // for (mileage of getMileageBand(facData)) {
        ...
        // console.log(mileageRanges.map(range => range.value));

        const mileageValue = `${mileageRanges.map(range => range.value)} miles`;
        ...

我可以得到 sortedBands 的值没问题，这是我在地图上生成径向波段所需要的。

但我试图在 for (mileage of mileageBand) 循环内迭代svcCenterBands 的值，但是当我在mileageBand 循环内记录mileageRanges 时，我得到了对象数组。

如果我用for of 索引记录mileageRange[mileage]，我只会得到mileageRange 中的第一个值，其余的都是未定义的。

我想看到的是对象数组中的值（按其范围），我可以在调用getMileageBand 时获得这些值，但我无法在for of 循环中获得这些值。

这就是我想要进入 for of 循环的内容：

这是在我的地图下方显示在屏幕上的带有径向带的内容。

最终，我希望每张卡片显示 0-30、31-60 等的序列，而不是在每张卡片中显示所有值。

我无法包含所有要测试的代码，因为环境变量太多太多，无法从数据库中提取数据，因此我包含了尽可能多的代码来支持我的问题。

【问题讨论】：

标签： javascript arrays for-of-loop

【解决方案1】：

您似乎想从 mileageRanges 中获取与 for..of 循环中 mileageBand 的当前元素相同索引的元素。在这种情况下，我建议不要使用 for..of，因为我不相信它提供了索引。这是一个简单的 for 循环。

const [mileageRanges, mileageBand] = getMileageBand(facData); // just call that expensive function once.

for (let i=0; i < mileageBand.length; i++) {
  const mileage = mileageBand[i];
  const mileageRange = mileageRanges[i].value;
}

【讨论】：