相关文章推荐
面冷心慈的夕阳  ·  [SOLVED] DWM ...·  7 月前    · 
跑龙套的毛衣  ·  【Android】画面卡顿优化列表流畅度三之 ...·  1 年前    · 
至今单身的仙人球  ·  JS实战开发经验!函数多参数传参技巧-腾讯云 ...·  1 年前    · 
不羁的感冒药  ·  Content Filtering·  2 年前    · 
逆袭的骆驼  ·  魏传柳·  2 年前    · 
小百科  ›  对对象数组中的值执行.join开发者社区
数组 peter 对象数组
伤情的匕首
2 年前
首页
学习
活动
专区
工具
TVP
返回腾讯云官网
提问
问 对对象数组中的值执行.join
Stack Overflow用户
提问于 2013-05-17 19:10:54
EN

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

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

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

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

仅对 name 属性执行 join 方法,以获得与前面相同的输出。

目前我有以下功能:

function joinObj(a, attr){
  var out = [];
  for (var i = 0; i < a.length; i++){
    out.push(a[i][attr]);
  return out.join(", ");
}

这段代码没有错,它可以工作,但是突然之间,我从一行简单、简洁的代码变成了一个非常命令式的函数。有没有一种更简洁、更理想、更实用的方式来写这篇文章呢?

11 283.9K 0 票数 357
EN
javascript
arrays
object

回答 11

Stack Overflow用户

回答已采纳

发布于 2013-05-17 19:13:29

如果要将对象映射到某个对象(在本例中为属性)。我认为如果你想编写函数式代码, Array.prototype.map 就是你要找的。

​

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

​

在现代JavaScript中:

​

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

​

(fiddle)

如果你想支持不是 ES5 compliant 的旧浏览器,你可以填充它(上面的MDN页面上有一个polyfill )。另一种选择是使用underscorejs的 pluck 方法:

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

Stack Overflow用户

发布于 2013-05-17 19:17:03

你可以随时覆盖你的对象的 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(", ");
    console.log(result);

​

票数 78
EN

Stack Overflow用户

发布于 2013-06-10 21:38:45

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

​

console.log(
        {name: "Joe", age: 22},
        {name: "Kevin", age: 24},
 
推荐文章
面冷心慈的夕阳  ·  [SOLVED] DWM Applications Error / Applications & Desktop Environments / Arch Linux Forums
7 月前
跑龙套的毛衣  ·  【Android】画面卡顿优化列表流畅度三之RecyclerView刷新机制notifyItemRangeInserte - 掘金
1 年前
至今单身的仙人球  ·  JS实战开发经验!函数多参数传参技巧-腾讯云开发者社区-腾讯云
1 年前
不羁的感冒药  ·  Content Filtering
2 年前
逆袭的骆驼  ·  魏传柳
2 年前
今天看啥   ·   Py中国   ·   codingpro   ·   小百科   ·   link之家   ·   卧龙AI搜索
删除内容请联系邮箱 2879853325@qq.com
小百科 - 百科知识指南
© 2024 ~ 沪ICP备11025650号