我有一个JavaScript对象数组,其结构如下:

objArray = [ { foo: 1, bar: 2}, { foo: 3, bar: 4}, { foo: 5, bar: 6} ];

我想从每个对象中提取一个字段,并获得一个包含值的数组,例如,字段foo将给出数组[1,3,5]。

我可以用这种简单的方法做到这一点:

function getFields(input, field) {
    var output = [];
    for (var i=0; i < input.length ; ++i)
        output.push(input[i][field]);
    return output;
}

var result = getFields(objArray, "foo"); // returns [ 1, 3, 5 ]

是否有更优雅或更惯用的方法来实现这一点,从而不需要自定义实用程序函数?


注意建议的重复,它介绍了如何将单个对象转换为数组。


当前回答

从对象数组收集不同字段的示例

let inputArray=[{id:1,名称:“name1”,值:“value1”},{id:2,名称:“name2”,值:“value2”},];let ids=inputArray.map((item)=>item.id);let names=inputArray.map((item)=>item.name);let values=inputArray.map((item)=>item.value);console.log(id);console.log(名称);console.log(值);

结果:

[ 1, 2 ]
[ 'name1', 'name2' ]
[ 'value1', 'value2' ]

其他回答

从对象数组中,使用for循环将属性的值提取为数组。

//input
objArray = [ { foo: 1, bar: 2}, { foo: 3, bar: 4}, { foo: 5, bar: 6} ]; 

//Code
let output=[];
for(let item of objArray){
    output.push(item.foo); 
}

// Output
[ 1, 3, 5 ]

从对象数组中轻松提取多个财产:

let arrayOfObjects = [
  {id:1, name:'one', desc:'something'},
  {id:2, name:'two', desc:'something else'}
];

//below will extract just the id and name
let result = arrayOfObjects.map(({id, name}) => ({id, name}));

结果将是〔{id:1,名称:'one'},{id:2,名称:'two'}〕

根据需要在map函数中添加或删除财产

这里有一个更短的实现方法:

let result = objArray.map(a => a.foo);

OR

let result = objArray.map(({ foo }) => foo)

您还可以检查Array.prototype.map()。

这取决于你对“更好”的定义。

其他答案指出了地图的使用,这是自然的(尤其是对于习惯于功能风格的人),而且简洁。我强烈建议您使用它(如果您不介意使用少数IE8-it人员)。所以,如果“更好”意味着“更简洁”、“可维护”和“可理解”,那么是的,它会更好。

另一方面,这种美丽不是没有额外成本的。我不太喜欢微面包,但我在这里做了一个小测试。结果是可以预测的,旧的丑陋的方式似乎比地图功能更快。所以,如果“更好”意味着“更快”,那么就不要,继续沿用老式的时尚。

同样,这只是一个微框架,绝不反对使用地图,这只是我的两分钱:)。

谈到纯JS的解决方案,我发现,尽管它可能很不优雅,但简单的索引for循环比它的替代方案更具性能。

从100000个元素数组中提取单个属性(通过jsPerf)

传统循环368操作/秒

var vals=[];
for(var i=0;i<testArray.length;i++){
   vals.push(testArray[i].val);
}

ES6用于。。循环303操作/秒

var vals=[];
for(var item of testArray){
   vals.push(item.val); 
}

Array.prototype.map 19操作/秒

var vals = testArray.map(function(a) {return a.val;});

TL;DR-.map()很慢,但如果您觉得可读性比性能更重要,可以使用它。

编辑#2:6/2019-jsPerf链接断开,已删除。