SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    811
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    array of objects -- print keys...

    I can't print keys from an array of objects....


    I tried using what's in this fiddle, but it's not working.. my array is structured differently... instead of actual keys it prints "0" or "1"....

    Code:
    
    	var members = [{
    		name: "stephen gupta",
    		points: 52
    	},{
    		name: "laura kowalski",
    		points: 67
    	},{
    		name: "John Rodriguez",
    		points: 33
    	}];
    
    what I did:
    Code:
    
    for (var i = 0; i < members.length; i++) {
    			$('#theMembers').append(keys[i] + ' : ' + members[i].name + '<br>' +
    					            	keys[i] + ' : ' + members[i].points + '<br><br>' );
    		}
    
    
    I know it's not right, but I can't figure out how to print something like

    Code:
    <li>name: stephen guta<br>points: 52</li>
    .... etc...

    thank you....

  2. #2
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    811
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    this works...

    Code:
     for (var i = 0; i < players.length; i++) {
    			$('.array ul').append('<li>name: ' + members[i]['name'] + '<br>points: ' + members[i]['points'] + '</li>'); 
    		}

    but how can I print the keys without hard-coding them?



    thank you....

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,678
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by maya90 View Post
    this works...

    Code:
     for (var i = 0; i < players.length; i++) {
    			$('.array ul').append('<li>name: ' + members[i]['name'] + '<br>points: ' + members[i]['points'] + '</li>'); 
    		}

    but how can I print the keys without hard-coding them?
    A useful way to do that is by using Object.keys to get the keys of an object:

    Code javascript:
    members.forEach(function (member) {
        var text = '',
            memberInfo = Object.keys(member).map(function (key, i) {
                return key + ': ' + member[key];
            });
        $('.array ul').append('<li>' + memberInfo.join('<br>') + '</li>');
    });

    But you must be aware of compatibility issues when using more advanced JavaScript feature such as that.

    As a result, the following tends to be used to loop through the properties of an object:

    Code javascript:
    var prop;
    for (prop in obj) {
        if (obj.hasOwnProperty(prop)) {
            // do stuff with prop and obj[prop]
        }
    }

    You can see both examples being used in the test code at http://jsfiddle.net/pmw57/MSzaL/
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  4. #4
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    811
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    thank you so much, Paul!! I really appreciate your help...


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •