javascript - jQuery Join Object Values - Stack Overflow

admin管理员组

文章数量:1206198

I am trying to join the values of an object/associative array to make changes to my code easier but I can't figure out how to properly join them. Here is my code:

$( document ).on( "click", ".taskstatus a", function ( event ) {
    event.preventDefault();
    classes = {
        'OPEN': 'state_open',
        'COMPLETED': 'state_completed',
        'SKIPPED': 'state_skipped',
        'REJECTED': 'state_rejected'
    };
    joinedClasses = classes.map(function(value, key){ return key; }).join(' ');
    state = $(this).data('state');
    taskID = $(this).closest('.task').attr('id').replace( 'task_', '' );

    // Update checkbox icon
    $(this).closest('.taskwrap').find('.taskcheckbox').data( 'icon', $(this).data('icon') );

    // Update task class
    alert( joinedClasses );
    $(this).closest('.task').removeClass( joinedClasses ).addClass( classes[state] );

});

This code breaks at the map function since it doesn't see it as an array, whats the best way to accomplish joining the values of class so that they look like this: "state_open state_completed state_skipped state_rejected"?

I am trying to join the values of an object/associative array to make changes to my code easier but I can't figure out how to properly join them. Here is my code:

$( document ).on( "click", ".taskstatus a", function ( event ) {
    event.preventDefault();
    classes = {
        'OPEN': 'state_open',
        'COMPLETED': 'state_completed',
        'SKIPPED': 'state_skipped',
        'REJECTED': 'state_rejected'
    };
    joinedClasses = classes.map(function(value, key){ return key; }).join(' ');
    state = $(this).data('state');
    taskID = $(this).closest('.task').attr('id').replace( 'task_', '' );

    // Update checkbox icon
    $(this).closest('.taskwrap').find('.taskcheckbox').data( 'icon', $(this).data('icon') );

    // Update task class
    alert( joinedClasses );
    $(this).closest('.task').removeClass( joinedClasses ).addClass( classes[state] );

});

This code breaks at the map function since it doesn't see it as an array, whats the best way to accomplish joining the values of class so that they look like this: "state_open state_completed state_skipped state_rejected"?

• javascript
• jquery

Share Improve this question Follow asked Apr 2, 2014 at 14:22 spyke01spyke01 44511 gold badge44 silver badges1616 bronze badges

Add a comment  | 

3 Answers 3

Sorted by: Reset to default 20

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.

If you can load linq.js, try this code:

joinedClasses = Enumerable.From(classes).Select("$.Value").ToArray().join(' ');

本文标签： javascriptjQuery Join Object ValuesStack Overflow