Javascript 对对象数组中的值执行.join
如果我有一个字符串数组,我可以使用Javascript 对对象数组中的值执行.join,javascript,arrays,object,Javascript,Arrays,Object,如果我有一个字符串数组,我可以使用.join()方法获得一个字符串,每个元素用逗号分隔,如下所示: ["Joe", "Kevin", "Peter"].join(", ") // => "Joe, Kevin, Peter" 我有一个对象数组,我想对其中的一个值执行类似的操作;所以从 [ {name: "Joe", age: 22}, {name: "Kevin", age: 24}, {name: "Peter", age: 21} ] 仅对name属性执行join方法,
.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(", ");
}
函数joinObj(a,attr){
var out=[];
对于(变量i=0;i
这段代码没有什么问题,它可以工作,但突然间我从一行简单、简洁的代码变成了一个非常重要的函数。如果要将对象映射到某个对象(在本例中为属性),是否有一种更简洁、更理想、更实用的编写方法。我认为这就是你想要的,如果你想在功能上编码
console.log([
{姓名:“乔”,年龄:22},
{姓名:“凯文”,年龄:24},
{姓名:“彼得”,年龄:21}
].map(功能(elem){
返回元素名;
}).加入(“,”)代码>您始终可以覆盖对象的toString
方法:
var-arr=[
{name:“Joe”,年龄:22,toString:function(){returnthis.name;}},
{name:“Kevin”,年龄:24,toString:function(){返回this.name;}},
{name:“Peter”,年龄:21,toString:function(){返回this.name;}}
];
var结果=arr.join(“,”);
控制台日志(结果)代码>我不知道是否有更简单的方法不用使用外部库就可以做到这一点,但我个人喜欢它,因为它有大量的实用程序用于处理数组、集合等
使用下划线,只需一行代码即可轻松完成此操作:
\uuu.pull(arr,'name')。join(',')
试试这个
var x= [
{name: "Joe", age: 22},
{name: "Kevin", age: 24},
{name: "Peter", age: 21}
]
function joinObj(a, attr) {
var out = [];
for (var i=0; i<a.length; i++) {
out.push(a[i][attr]);
}
return out.join(", ");
}
var z = joinObj(x,'name');
z > "Joe, Kevin, Peter"
var y = joinObj(x,'age');
y > "22, 24, 21"
var x=[
{姓名:“乔”,年龄:22},
{姓名:“凯文”,年龄:24},
{姓名:“彼得”,年龄:21}
]
函数joinObj(a,属性){
var out=[];
对于(var i=0;i“Joe,Kevin,Peter”
变量y=joinObj(x,'age');
y>“22、24、21”
我也遇到过使用reduce
方法,它看起来是这样的:
console.log(
[
{姓名:“乔”,年龄:22},
{姓名:“凯文”,年龄:24},
{姓名:“彼得”,年龄:21}
]
.减少(功能a、b){
返回(a.name | | a)+“,“+b.name}
)
)
在节点或ES6+上:
users.map(u=>u.name).join(“,”)
假设对象数组由变量用户引用
如果可以使用ES6,那么最简单的解决方案是:
users.map(user => user.name).join(', ');
如果没有,则可以这样使用:
_.map(users, function(user) {
return user.name;
}).join(', ');
我知道这是一条老线索,但对任何遇到这条线索的人来说都是超级相关的
这里建议使用Array.map,这是我一直使用的一种非常棒的方法。
还提到了Array.reduce
我个人会在这个用例中使用Array.reduce。
为什么?尽管代码稍微不那么干净/清晰。但这比将映射函数管道化到联接要高效得多
这是因为Array.map必须循环遍历每个元素以返回一个包含数组中对象的所有名称的新数组。Array.join然后循环遍历数组的内容以执行联接
通过使用模板文本将代码放到一行中,您可以提高jackweirdys reduce answer的可读性。“在所有现代浏览器中也受支持”
如果对象和动态键:“应用程序\”:{“1\”:“元素1\”,“2\”:“元素2\”}
不确定,但所有这些答案都有效,但不是最优的,因为它们正在执行两次扫描,您可以在一次扫描中执行。尽管O(2n)被认为是O(n),但有一个真正的O(n)总是更好的
您可以转换为数组,以便获取对象名称
var objs=[
{姓名:“乔”,年龄:22},
{姓名:“凯文”,年龄:24},
{姓名:“彼得”,年龄:21}
];
document.body.innerHTML=Object.values(objs.map)(函数(obj){
返回obj.name;
});
最简单的方法:
const oldArrayOfObjects=[
{姓名:“鲍勃”,年龄:40},
{姓名:“安德鲁”,年龄:25},
{姓名:“彼得”,年龄:30}];
const newArrayOfStringNames=oldArrayOfObjects.map((OA)=>OA.name);
const newArrayOfAges=旧arrayofobjects.map((OA)=>OA.age);
console.log({newArrayOfStringNames,newArrayOfAges})
以一种语言为例,Pythonic的方法是“,”。join([i.name for i in a])
在ES6中,您可以这样做:users.map(x=>x.name)。join(“,”);
。这一个。但是,如果您需要支持此复古浏览器,则需要填充IE<9的.map原型成员。@Tommi评论不错。我添加了关于多边形填充的解释,以及使用下划线时使用Pulk的建议。@jackweirdy我很高兴我能提供帮助:)值得一提的是,正如map/reduce/filter不是“pythonic”,理解是另一种方式。在JavaScript正在开发的新规范(Harmony)以及一些已经存在的浏览器(firefox)中,你有pythonic理解。你可以做[x.name for x of users]
(spec)。值得一提的是,就像使用map/reduce/filter不是很“pythonic”,另一种方式可能在JavaScript中也适用。不过,CoffeeScript对它们很酷。只是更新—ES6中删除了数组理解,也许我们会在ES7中得到它们。在CoffeeScript中:users.map((obj)->obj.name.join(','))
这是一个非常有趣的方法,我不知道你可以在JS中这样做。虽然数据来自API,所以它可能不适合我的用例,但它确实值得思考。看起来不是很好DRY@BadHorsie不,它不是干的。但当然,您可以在数组之外定义一个函数,然后将是所有项的toString
方法的函数,使用for循环
// a one line answer to this question using modern JavaScript
x.reduce((a, b) => `${a.name || a}, ${b.name}`);
Object.keys(myObject).map(function (key, index) {
return myObject[key]
}).join(', ')
const Join = (arr, separator, prop) => {
let combined = '';
for (var i = 0; i < arr.length; i++) {
combined = `${combined}${arr[i][prop]}`;
if (i + 1 < arr.length)
combined = `${combined}${separator} `;
}
return combined;
}
skuCombined = Join(option.SKUs, ',', 'SkuNum');