对对象数组中的值执行.join

Question

如果我有一个字符串数组,我可以使用该.join()方法获取单个字符串,每个元素用逗号分隔,如下所示:

["Joe", "Kevin", "Peter"].join(", ") // => "Joe, Kevin, Peter"

我有一个对象数组,我想对其中的值执行类似的操作; 所以

[
  {name: "Joe", age: 22},
  {name: "Kevin", age: 24},
  {name: "Peter", age: 21}
]

join仅对name属性执行方法,以实现与以前相同的输出.

目前我有以下功能:

function joinObj(a, attr){
  var out = [];

  for (var i = 0; i < a.length; i++){
    out.push(a[i][attr]);
  }

  return out.join(", ");
}

这段代码没有任何问题,它可以工作,但突然之间,我已经从一个简单,简洁的代码行转变为一个非常重要的代码.是否有更简洁,更理想的写作方式？

Answer 1

如果要将对象映射到某个东西(在本例中为属性).Array.prototype.map如果你想在功能上进行编码,我想你正在寻找什么.

[
  {name: "Joe", age: 22},
  {name: "Kevin", age: 24},
  {name: "Peter", age: 21}
].map(function(elem){
    return elem.name;
}).join(",");

在现代JavaScript中:

[
  {name: "Joe", age: 22},
  {name: "Kevin", age: 24},
  {name: "Peter", age: 21}
].map(e => e.name).join(",");

(小提琴)

如果您想支持不是ES5投诉的旧版浏览器,您可以对其进行填充(上面的MDN页面上有一个polyfill).另一种选择是使用underscorejs的pluck方法:

var users = [
      {name: "Joe", age: 22},
      {name: "Kevin", age: 24},
      {name: "Peter", age: 21}
    ];
var result = _.pluck(users,'name').join(",")

Answer 2

那么你总是可以覆盖toString你的对象的方法:

var arr = [
    {name: "Joe", age: 22, toString: function(){return this.name;}},
    {name: "Kevin", age: 24, toString: function(){return this.name;}},
    {name: "Peter", age: 21, toString: function(){return this.name;}}
];

var result = arr.join(", ");
//result = "Joe, Kevin, Peter"

Answer 3

const lists  = [
  {name: "Joe", age: 22},
  {name: "Kevin", age: 24},
  {name: "Peter", age: 21}
]

const joinedStr = lists.map((list) => list.name).join(" ")

console.log('joined',joinedStr)

这应该可以做到，因为映射将返回一个字符串数组，然后您可以加入它

Answer 4

我也遇到过使用这种reduce方法,它看起来像是这样的:

[
  {name: "Joe", age: 22},
  {name: "Kevin", age: 24},
  {name: "Peter", age: 21}
].reduce(function (a, b) {return (a.name || a) + ", " + b.name})

这(a.name || a)是第一个元素被正确处理,但其余的(其中a是一个字符串,因此a.name是未定义的)不被视为对象.

编辑:我现在已经进一步重构了这个:

x.reduce(function(a, b) {return a + ["", ", "][+!!a.length] + b.name;}, "");

我相信这是吸尘器,a始终是一个字符串,b始终是一个对象(由于使用的可选参数初值中reduce)

编辑6个月后:哦,我在想什么."清洁器".我激怒了代码众神.

Answer 5

在节点或 ES6+ 上：

users.map(u => u.name).join(', ')

Answer 6

我不知道是否有一种更简单的方法可以在不使用外部库的情况下完成它,但我个人喜欢使用 了大量实用程序来处理数组,集合等的underscore.js.

使用下划线,您可以使用一行代码轻松完成此操作:

_.pluck(arr, 'name').join(', ')

Answer 7

假设对象数组由变量引用users

如果可以使用 ES6 那么最简单的解决方案将是：

users.map(user => user.name).join(', ');

如果没有，可以使用lodash ：

 _.map(users, function(user) {
     return user.name;
 }).join(', ');