javascript - Creating an array and combining keys

Question

How can amend how items are pushed into a jQuery array? This is the code I'm using at the moment:

   var sub_updated = [];
    $('.current-sub-items').each(function() {
        $(this).find('.prod-select').each(function() {
            if($(this).parent().css('display') != 'none'){
                var s_main_prod = $(this).val();
                sub_updated.push({
                    product:s_main_prod,
                });
            }
        });
        $(this).find('.var-select').each(function() {
            if($(this).parent().css('display') != 'none'){
                var s_var_prod = $(this).val();
                sub_updated.push({
                    variation:s_var_prod,
                });
            }
        });
    });
    
    console.log(sub_updated);

This outputs:

0: {product: "201"}
1: {variation: "202"}
2: {product: "192"}
3: {variation: "194"}
4: {product: "965"}

How can I output in the following instead?

0: {product: "201", variation: "202"}
1: {product: "192", variation: "194"}
2: {product: "965"}

Line 2 doesn't have a variation.

question from:https://stackoverflow.com/questions/65904045/creating-an-array-and-combining-keys

Answer 1

you can try this :

var sub_updated = [];
$('.current-sub-items').each(function() {
    var obj = {};
    $(this).find('.prod-select').each(function() {
        if($(this).parent().css('display') != 'none'){
            var s_main_prod = $(this).val();
             if (s_main_prod ){
             obj['product']=s_main_prod
             }
        }
    });
    $(this).find('.var-select').each(function() {
        if($(this).parent().css('display') != 'none'){
            var s_var_prod = $(this).val();
             if (s_var_prod ){
             obj['variation']=s_var_prod
             }
        }
    });
    sub_updated.push(obj);
})