Question

在开始下一个功能之前，我只是试图使用map完全返回数组。但是当我安慰它时，我收到了不完整的数组

这是我的示例数组：

data = [{
        "a": 1,
        "b": 5,
        "c": 9,
        "d": 1,
        "e": 4,
        "f": 44,
        "g": 23,
        "h": 12,
        "i": 22,
        "j": 23,
        "k": [{
            "a": 1,
            "b": 5,
            "c": 9,
            "d": 1
        }, {
            "a": 1,
            "b": 5,
            "c": 9,
            "d": 1
        }]
    },
    {
        "a": 2,
        "b": 6,
        "c": 10,
        "d": 1,
        "e": 4,
        "f": 44,
        "g": 23,
        "h": 12,
        "i": 22,
        "j": 23,
        "k": [{
            "a": 1,
            "b": 5,
            "c": 9,
            "d": 1
        }, {
            "a": 1,
            "b": 5,
            "c": 9,
            "d": 1
        }]
    },
    {
        "a": 3,
        "b": 7,
        "c": 11,
        "d": 1,
        "e": 4,
        "f": 44,
        "g": 23,
        "h": 12,
        "i": 22,
        "j": 23,
        "k": [{
            "a": 1,
            "b": 5,
            "c": 9,
            "d": 1
        }, {
            "a": 1,
            "b": 5,
            "c": 9,
            "d": 1
        }]
    },
    {
        "a": 4,
        "b": 8,
        "c": 12,
        "d": 1,
        "e": 4,
        "f": 44,
        "g": 23,
        "h": 12,
        "i": 22,
        "j": 23,
        "k": [{
            "a": 1,
            "b": 5,
            "c": 9,
            "d": 1
        }, {
            "a": 1,
            "b": 5,
            "c": 9,
            "d": 1
        }]
    }
]

var result = data.map(x=>({...x}));     
console.log(result);

这是我整理数组时的样子：

[{
        "a": 1,
        "b": 5,
        "c": 9,
        "d": 1,
        "e": 4,
        "f": 44,
        "g": 23,
        "h": 12,
        "i": 22,
        "j": 23,
        "k": []
    },
    {
        "a": 2,
        "b": 6,
        "c": 10,
        "d": 1,
        "e": 4,
        "f": 44,
        "g": 23,
        "h": 12,
        "i": 22,
        "j": 23,
        "k": []
    },
    {
        "a": 3,
        "b": 7,
        "c": 11,
        "d": 1,
        "e": 4,
        "f": 44,
        "g": 23,
        "h": 12,
        "i": 22,
        "j": 23,
        "k": []
    },
    {
        "a": 4,
        "b": 8,
        "c": 12,
        "d": 1,
        "e": 4,
        "f": 44,
        "g": 23,
        "h": 12,
        "i": 22,
        "j": 23,
        "k": []
    }
]

当我使用.map()函数时，我希望数组完整。

Answer 1

扩展只是浅表副本-因此不会复制内部数组。

对于简单的深层副本，请使用JSON.stringify和JSON.parse。

const data = [{"a":1,"b":5,"c":9,"d":1,"e":4,"f":44,"g":23,"h":12,"i":22,"j":23,"k":[{"a":1,"b":5,"c":9,"d":1},{"a":1,"b":5,"c":9,"d":1}]},{"a":2,"b":6,"c":10,"d":1,"e":4,"f":44,"g":23,"h":12,"i":22,"j":23,"k":[{"a":1,"b":5,"c":9,"d":1},{"a":1,"b":5,"c":9,"d":1}]},{"a":3,"b":7,"c":11,"d":1,"e":4,"f":44,"g":23,"h":12,"i":22,"j":23,"k":[{"a":1,"b":5,"c":9,"d":1},{"a":1,"b":5,"c":9,"d":1}]},{"a":4,"b":8,"c":12,"d":1,"e":4,"f":44,"g":23,"h":12,"i":22,"j":23,"k":[{"a":1,"b":5,"c":9,"d":1},{"a":1,"b":5,"c":9,"d":1}]}];

const res = data.map(x => JSON.parse(JSON.stringify(x)));
console.log(res);

.as-console-wrapper { max-height: 100% !important; top: auto; }

还有一个受较少支持的Object.fromEntries-此功能目前处于草稿阶段：

const data = [{"a":1,"b":5,"c":9,"d":1,"e":4,"f":44,"g":23,"h":12,"i":22,"j":23,"k":[{"a":1,"b":5,"c":9,"d":1},{"a":1,"b":5,"c":9,"d":1}]},{"a":2,"b":6,"c":10,"d":1,"e":4,"f":44,"g":23,"h":12,"i":22,"j":23,"k":[{"a":1,"b":5,"c":9,"d":1},{"a":1,"b":5,"c":9,"d":1}]},{"a":3,"b":7,"c":11,"d":1,"e":4,"f":44,"g":23,"h":12,"i":22,"j":23,"k":[{"a":1,"b":5,"c":9,"d":1},{"a":1,"b":5,"c":9,"d":1}]},{"a":4,"b":8,"c":12,"d":1,"e":4,"f":44,"g":23,"h":12,"i":22,"j":23,"k":[{"a":1,"b":5,"c":9,"d":1},{"a":1,"b":5,"c":9,"d":1}]}];

const res = data.map(x => Object.fromEntries(Object.entries(x)));
console.log(res);

.as-console-wrapper { max-height: 100% !important; top: auto; }

Answer 2

不是因为地图功能，而是因为控制台。如果控制台太长，则可以剪切输出。如果您需要查看完整结果，可以进行

console.log(JSON.stringify(result));

或者其他一些代码修改嵌套数组（data[0].k = []）。由于要进行高级复制，因此您将看到空数组。在这种情况下，您应该制作原始data的深层副本。对于这种情况，您有一个非常有用的库lodash

因此您可以这样做：

var result = _.cloneDeep(data);

如何在javascript中使用对象数组映射属性

2 个答案: