Array.prototype.map() 返回空项目，但 Array.prototype.forEach() 不答案

【问题标题】：Array.prototype.map() returns empty item but Array.prototype.forEach() doesn'tArray.prototype.map() 返回空项目，但 Array.prototype.forEach() 不
【发布时间】：2019-02-22 21:33:27
【问题描述】：

我遇到了来自 .map() 的奇怪行为。它返回一个空项，而 .forEach() 不返回。

代码如下：

class Entry {
    constructor(data) {
        this.name = data[0],
        this.age = data[1],
        this.school = data[2]
    };

    get organised() {
        return this.organise();
    };

    organise() {
        const data = {
            name: this.name,
            school: this.school
        };
        return data;
    }
}

const getDataForEach = (obj) => {
    let r = [];
    obj.forEach((i) => {
        const e = new Entry(i);
        r.push(e.organised);
    });
    return r;
};
getDataForEach(input); // return normal object array [{...}, {...}, ...]

但如果我使用.map()，它会返回一个对象数组，其中第一项为空。其他项与.forEach()的结果相同。

const getDataMap = (obj) => {
    return obj.map((i) => {
        const e = new Entry(i);
        console.log(e) // return normal [{...}]
        console.log(e.organised) // return normal {...}
        return e.organised;
    });
};
getDataMap(input); // return an object array with the first item empty [<1 empty item>, {...}, {...}, ...]

你有过类似的经历吗？

【问题讨论】：

您确定e.organized 没有返回任何内容吗？
这似乎是sparse arrays 的预期行为
是的，它们是使用正整数键的对象。例如[, 2] 类似于{ "1": 2, "length": 2 }
更多详细信息请参见此处的第二个示例codereview.stackexchange.com/questions/180204/…
另一种选择是Object.values(obj).map（但在 IE 中不可用）stackoverflow.com/a/41802221/1383168

标签： javascript arrays object foreach array.prototype.map

【解决方案1】：

在处理稀疏数组时，map 和 forEach() 都会跳过从未分配或已删除的元素。

不过，不同之处在于 map 自己构造结果数组，而您的 forEach() 代码将推入结果数组。 push() 永远不会在数组中创建空洞，因为它总是以当前长度附加一个新元素，但 map() 可以。 MDN指出：

由于规范中定义的算法，如果调用映射的数组是稀疏的，则结果数组也将是稀疏的，保持相同的索引为空白。

如果您将forEach 代码更改为使用输入数组索引而不是使用push，您将获得类似于map 的结果，例如

const getDataForEach = (obj) => {
    let r = [];
    obj.forEach((i, index) => {
        const e = new Entry(i);
        r[index] = e.organised;
    });
    return r;
};

【讨论】：