Here's my code.
var myOwnObject = {
car1: 'Toyota',
car2: 'Honda',
car3: 'BMW',
car4: ['Subaru', 'Nissan', 'Lambo', 'Jaguar']
};
console.log("1. " + myOwnObject.car1 + ", 2. " + myOwnObject.car2 + ", 3. " + myOwnObject.car3 + " , 4. " + myOwnObject.car4[0] + myOwnObject.car4[1]);What I want to achieve is that I want to display all values especially in array section without calling array one by one.
Thanks.
I'm pretty sure the code you are looking for is about how to display this information dynamically to the page (without having to manually print 1., 2., etc.). Here's a way to do it:
<ol id="sampleSection"></ol>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
var myOwnObject = { car1: 'Toyota', car2: 'Honda', car3: 'BMW', car4: ['Subaru', 'Nissan', 'Lambo', 'Jaguar'] };
$.each(myOwnObject, function (index, item) {
$("<li>")
.html(item)
.appendTo($("#sampleSection"));
});
</script>
In plain Javascript, you could get the keys with Object.keys and iterate this array with Array#forEach and check if the property is an array, then join the array, otherwise take the value for output.
var myOwnObject = { car1: 'Toyota', car2: 'Honda', car3: 'BMW', car4: ['Subaru', 'Nissan', 'Lambo', 'Jaguar'] };
Object.keys(myOwnObject).forEach(function (k) {
if (Array.isArray(myOwnObject[k])) {
console.log(k + ': ' + myOwnObject[k].join(', '));
} else {
console.log(k + ': ' + myOwnObject[k]);
}
});
var myOwnObject = {
car1: 'Toyota',
car2: 'Honda',
car3: 'BMW',
car4: ['Subaru', 'Nissan', 'Lambo', 'Jaguar']
};
var array = $.map(myOwnObject, function(val) {
return [val];
});
console.log(array.map(function(val, idx) {
return (idx + 1) + '. ' + (Array.isArray(val) ? val.join(' ') : val);
}).join(', '));<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>Probably the simplest way to achieve the result you want is to create an helper to flatten your data.
Here you are an example:
function parser(object){
let results = [];
for(let let in object){
let item = object[key];
if(item instanceof Array){
item.forEach((el) => { results.push(item)})
}
else
results.push(item)
}
return results
}
With your brand-new array you could do anything, such as
let res = parser(object);
let output = '';
res.forEach((item, index) => {
output = output + index + ". " + item;
})
console.log(output);
In nfn neil's solution he made use of the fact that when arrays are "added" to a string they are converted into a string first, using their built-in method toString().
As your object has members of different types (strings and arrays), this approach works very well. However, if you want to have more control on how to concatenate your arrays then you will have to put in a bit more work:
<ol id="sampleSection"></ol>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
var myOwnObject = { car1: 'Toyota', car2: 'Honda', car3: 'BMW', car4: ['Subaru', 'Nissan', 'Lambo', 'Jaguar'] };
$.each(myOwnObject, function (index, item) {
$("<li>")
.html($.isArray(item)
?item.join('<your separator>') // arrays
:item) // strings
.appendTo($("#sampleSection"));
});
</script>
Instead of the item.join() function you could do an item.map(function(itm,idx){return idx+'. '+itm;}-construct with the possibility of weaving in the index position of each element.
for(var key in myOwnObject){ console.log(myOwnObject[key]) }