If you want to map objects to something (in this case a property). I think Array.prototype.map is what you're looking for if you want to code functionally.
(fiddle)
If you want to support older browsers, that are not ES5 compliant you can shim it (there is a polyfill on the MDN page above). Another alternative would be to use underscorejs's pluck method:
var users = [
{name: "Joe", age: 22},
{name: "Kevin", age: 24},
{name: "Peter", age: 21}
];
var result = _.pluck(users,'name').join(",")
Answer from Benjamin Gruenbaum on Stack OverflowIf you want to map objects to something (in this case a property). I think Array.prototype.map is what you're looking for if you want to code functionally.
(fiddle)
If you want to support older browsers, that are not ES5 compliant you can shim it (there is a polyfill on the MDN page above). Another alternative would be to use underscorejs's pluck method:
var users = [
{name: "Joe", age: 22},
{name: "Kevin", age: 24},
{name: "Peter", age: 21}
];
var result = _.pluck(users,'name').join(",")
Well you can always override the toString method of your objects:
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);
Run code snippetEdit code snippet Hide Results Copy to answer Expand
javascript - jQuery Join Object Values - Stack Overflow
javascript - How to join values of one object? - Stack Overflow
javascript - Combine object key values into single string with separator - Stack Overflow
javascript - join() for object properties? - Stack Overflow
What is the most efficient way to join object properties in JavaScript?
Can I join properties from objects that are deeply nested?
What if there's a possibility of undefined values?
You can use jQuery.map function. It is more forgiving and therefore allows usage on an associative array (like yours) as well as a traditional array:
joinedClasses = $.map(classes, function(e){
return e;
});
result:
["state_open", "state_completed", "state_skipped", "state_rejected"]
live example: http://jsfiddle.net/MK4f7/
this can then be joined using a space in the same way as your original:
joinedClasses = $.map(classes, function(e){
return e;
}).join(' ');
Since it's not an array you can use map. You need to use a for loop like below:
var classes = {
'OPEN': 'state_open',
'COMPLETED': 'state_completed',
'SKIPPED': 'state_skipped',
'REJECTED': 'state_rejected'
};
// Create a tmp array for the join
var joined = [];
// Loop over the object Literal.
// the var key is now the prop in the object.
for (var key in classes) {
var val = classes[key]; // gets the value by looking for the key in the object
joined.push(val);
}
// Join the array with a space.
joined = joined.join(' ');
Working fiddle
EDIT: accepted answer is better if you want to do it with jQuery, cheers.
You can use Object.values and map: Objet.values returns an array of values in the object and join converts these values to string by joining them by ',' here.
const users = [{
name: "Jon",
age: 34,
country: "ES"
}];
var result = users.map(u => Object.values(u).join(','));
console.log(result);
You can use Object.values to get an array of the properties of your object, then use the join method of that array to create a string from the values:
var result = users.map(function (a) {
return Object.values(a).join(', ');
});
console.log(result[0]); // Jon, 34, ES
Another answer to show 1-liners for joining keys, or values, or both:
Join Keys: Object.keys(obj)
const obj = {a: '1', b: '2'};
console.log(Object.keys(obj).join(','));
Join Values: Object.values(obj)
const obj = {a: '1', b: '2'};
console.log(Object.values(obj).join(','));
Join Both: Object.entries(obj)
const obj = {a: '1', b: '2'};
console.log(Object.entries(obj).join(','));
Note: Object.entries(obj) was announced a standard by ecma in June 2017 (See link). Browser support: all except IE Desktop and Mobile Safari.

Update: Object.entries(obj) now supports in Mobile Safari Also
Ref: developer.mozilla.org

You can use Array#map method along with Array#join method. Where Array#filter method can be used for filtering non-empty and defined property values.
function obsKeysToString(o, k, sep) {
// iterate over key array
return k.map(function(key) {
// get object property value
return o[key];
// filter out non-empty and defined property
}).filter(function(v) {
return v;
// join the property value array with the separator
}).join(sep);
}
var keys = ['name', 'description']
var obj = {
id: 1,
name: 'Test',
description: 'Lorem ipsum dolores',
moreKeysHere: 'moreValues'
}
function obsKeysToString(o, k, sep) {
return k.map(function(key) {
return o[key];
}).filter(function(v) {
return v;
}).join(sep);
}
console.log(obsKeysToString(obj, keys, '-'))
Same solution with ES6 arrow function
function obsKeysToString(o, k, sep) {
return k.map(key => o[key]).filter(v => v).join(sep);
}
var keys = ['name', 'description']
var obj = {
id: 1,
name: 'Test',
description: 'Lorem ipsum dolores',
moreKeysHere: 'moreValues'
}
function obsKeysToString(o, k, sep) {
return k.map(key => o[key]).filter(v => v).join(sep);
}
console.log(obsKeysToString(obj, keys, '-'))
Another solution using Array#reduce method.
function obsKeysToString(o, k, sep) {
// iterate over key array
return k.reduce(function(str, key) {
// generate string based on each key
return str + (o.hasOwnProperty(key) ? (str.length ? sep : '') + o[key] : '');
}, '')
}
var keys = ['name', 'description']
var obj = {
id: 1,
name: 'Test',
description: 'Lorem ipsum dolores',
moreKeysHere: 'moreValues'
}
function obsKeysToString(o, k, sep) {
return k.reduce(function(str, key) {
return str + (o.hasOwnProperty(key) ? (str.length ? sep : '') + o[key] : '');
}, '')
}
console.log(obsKeysToString(obj, keys, '-'))
Object.keys could help you:
const printData = Object.keys(data).map(key => `${key}: ${data[key]}`).join("<br />");
You can try the combination of Object.entries and Array.map
const data = { a: '213', b: 'asv', c: 'sdfs' };
let printData = Object.entries(data).map(entry => entry.join(': ')).join('<br/>');
console.log(printData); // "a: 213<br/>b: asv<br/>c: sdfs"
Here the problem is you are using objects where the data is stored in form of {key : string} and {value : <number | string | boolean >} form. You can not possibly store visual line-breaks in object-values. But if you print Object.value rather than Object itself it will print data in visual line breaks.
const obj = {
value : 'Hindi\nEnglish\nFrance'
}
console.log(obj)
console.log(obj.value);
/* first one will give o/p - {
"value": "Hindi\nEnglish\nFrance"
} */
/* second one will give o/p
Hindi
English
France */
You have text with line breaks in value. If you print in console theObj.value you will see expected.