减少数组以更改内容

Question

如何使用array.reduce改变数组内容的方式。我不想对内容做任何数学运算。

原始数组：

var myArray = [
    {id:1, name:'name01', value:11},
    {id:2, name:'name02', value:22},
    {id:3, name:'name03', value:33},
    {id:4, name:'name04', value:44},
    {id:5, name:'name05', value:55}
]

我希望将其更改为：

[
    {1:{id:1, name:'name01', value:11}},
    {2:{id:2, name:'name02', value:22}},
    {3:{id:3, name:'name03', value:33}},
    {4:{id:4, name:'name04', value:44}},
    {5:{id:5, name:'name05', value:55}}
]

所以 id 作为 key 从 object 中弹出，而 value 是整个 object。

仅使用 array.reduce 而不使用任何 for loop 或 groupBy 可以实现吗？

Answer 1

您最好使用 Array#map，因为数组中的每个项目都需要一个新对象。

var array = [{ id: 1, name: 'name01', value: 11 }, { id: 2, name: 'name02', value: 22 }, { id: 3, name: 'name03', value: 33 }, { id: 4, name: 'name04', value: 44 }, { id: 5, name: 'name05', value: 55 }],
    result = array.map(a => ({ [a.id]: a }));

console.log(result);

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

想要的reduce样式，我不推荐。

var array = [{ id: 1, name: 'name01', value: 11 }, { id: 2, name: 'name02', value: 22 }, { id: 3, name: 'name03', value: 33 }, { id: 4, name: 'name04', value: 44 }, { id: 5, name: 'name05', value: 55 }],
    result = array.reduce((r, a) => (r.push({ [a.id]: a }), r), []);

console.log(result);

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

使用concat，我也不推荐。

var array = [{ id: 1, name: 'name01', value: 11 }, { id: 2, name: 'name02', value: 22 }, { id: 3, name: 'name03', value: 33 }, { id: 4, name: 'name04', value: 44 }, { id: 5, name: 'name05', value: 55 }],
    result = array.reduce((r, a) => r.concat({ [a.id]: a }), []);

console.log(result);

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

Answer 2

您可以使用 .map() 代替 ES6 计算的属性名称，如下所示：

var myArray = [
    {id:1, name:'name01', value:11},
    {id:2, name:'name02', value:22},
    {id:3, name:'name03', value:33},
    {id:4, name:'name04', value:44},
    {id:5, name:'name05', value:55}
];

var result = myArray.map((elem) => ({[elem.id]: elem}));

console.log(result);

或者如果你坚持使用.reduce():

var myArray = [
    {id:1, name:'name01', value:11},
    {id:2, name:'name02', value:22},
    {id:3, name:'name03', value:33},
    {id:4, name:'name04', value:44},
    {id:5, name:'name05', value:55}
];

var result = myArray.reduce((res, curr) => res.concat({[curr.id]: curr}), []);

console.log(result);

或者，ES5 语法（为了清晰起见，因为您正在尝试学习）

var result = myArray.reduce(function (res, curr) {
    var newObj = {};
    newObj[curr.id] = curr;
    return res.concat(newObj);
}, []);

Answer 3

var myArray = [
    {id:1, name:'name01', value:11},
    {id:2, name:'name02', value:22},
    {id:3, name:'name03', value:33},
    {id:4, name:'name04', value:44},
    {id:5, name:'name05', value:55}
];

let result = myArray.map(x => ({[x.id]: x }));
console.log(result)

Answer 4

你没有减少任何东西，所以即使尝试 array.reduce 也没有意义。

您可以使用 array.map 并非常轻松地做到这一点。

var myArray = [
{id:1, name:'name01', value:11},
{id:2, name:'name02', value:22},
{id:3, name:'name03', value:33},
{id:4, name:'name04', value:44},
{id:5, name:'name05', value:55}
]

var newArray = myArray.map((function(val) { return { [val.id]: val }}));
console.log(newArray);

减少数组以更改内容

Reduce an array to change content

javascript

arrays

ecmascript-6

array-reduce