Menu
So here I have a database of user objects and I would like to push each one into the 'allUsers' array. I then want to be able to loop through this array and access a property e.g. allUsers[i].genrePref. How do I push all of these variables into the array to store them like [user, jon, lucy, mike, luke...
// Users
var user = {username: user9110252username, genrePref: user9110252genre};
var jon = {username: 'Jon', genrePref: 'rock'};
var lucy = {username: 'Lucy', genrePref: 'pop'};
var mike = {username: 'Mike', genrePref: 'rock'};
var luke = {username: 'Luke', genrePref: 'house'};
var james = {username: 'James', genrePref: 'house'};
var dave = {username: 'Dave', genrePref: 'bass'};
var sarah = {username: 'Sarah', genrePref: 'country'};
var natalie = {username: 'Natalie', genrePref: 'bass'};
// Users array
var allUsers = [];
464
With an array, you store a collection of elements you can access by their position (or index). Objects take that concept further by providing a way to structure related data that's easy to read and retrieve using key/value pairs. It's common to combine the two by creating an array of objects.
A nested data structure is an array or object which refers to other arrays or objects, i.e. its values are arrays or objects. Such structures can be accessed by consecutively applying dot or bracket notation. Here is an example: const data = { code: 42, items: [{ id: 1, name: 'foo' }, { id: 2, name: 'bar' }] };
To just add the variables to the array, there's really no other way except to do exactly what you did in your example, which is to manually add each variable to your array.
// Users array
var allUsers = [
user,
jon,
lucy,
mike,
luke,
james,
dave,
sarah,
natalie
];
BUT, you could probably do something a little more robust, which in its simplest form is to define an object literal called users that contains each user object. Then you not only have the added benefit of a pseudo-namespacing around your users, you can easily iterate over the object literal and put each user into an array, as such:
// Users
var users = {
user : {username: user9110252username, genrePref: user9110252genre},
jon : {username: 'Jon', genrePref: 'rock'},
lucy : {username: 'Lucy', genrePref: 'pop'},
mike : {username: 'Mike', genrePref: 'rock'},
luke : {username: 'Luke', genrePref: 'house'},
james : {username: 'James', genrePref: 'house'},
dave : {username: 'Dave', genrePref: 'bass'},
sarah : {username: 'Sarah', genrePref: 'country'},
natalie : {username: 'Natalie', genrePref: 'bass'}
}
// Users array
var allUsers = [];
// Populate users array
for(var key in users) {
allUsers.push(users[key]);
}
One last note on style. You should probably avoid explicitly setting the 'key' of each user object in your users object literal to be the name of the user. If you have any users with the same name, this model will break. Instead, consider generating some kind of unique key, like a guid, or some other unique value for each user. That way you'll never accidentally overwrite an entry in your users object if, for example, you are populating this users object from some database and two or more users happen to have the same name.
Good luck.
177
var arr = [{username: 'Jon', genrePref: 'rock'},{username: 'Lucy', genrePref: 'pop'},{username: 'Mike', genrePref: 'rock'},{username: 'Luke', genrePref: 'house'},{username: 'James', genrePref: 'house'},{username: 'Dave', genrePref: 'bass'},{username: 'Sarah', genrePref: 'country'},{username: 'Natalie', genrePref: 'bass'}];
var text = "<table border ='1'><tr><th>Username</th><th>genrePref</th></tr>"
for (var i=0;i<arr.length;i++){
text+="<tr><td>"+arr[i].username+"</td><td>"+arr[i].genrePref+"</td></tr>"
}
text+="</table>";
document.write(text);<html>
<head>
<title>Javascript</title>
</head>
<body>
</body>
</html>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
