0

javascriptの関数を使用してデータを集計しようとしています (この質問reduce()に似ています):

HTML

Product 1: <button id="product1">Add one</button>
Product 2: <button id="product2">Add one</button>

JS

$('button').on('click', function() {
            var pid = $(this).attr('id');

            cart[cart.length] = {id:pid, qty:1}

            var result = cart.reduce(function(res, obj) {
                    if (!(obj.id in res))
                        res.__array.push(res[obj.id] = obj);
                    else {
                        res[obj.id].qty += obj.qty;
                    }
                    return res;
                }, {__array:[]})

            console.log(result)
    });
});

返される配列にデータが含まれていないため、機能させることができませんqty。例えば：

Object {__array: Array[1], product1: Object}
Object {__array: Array[1], product1: Object}
Object {__array: Array[2], product1: Object, product2: Object}

私が探している結果は、次のようなものです。

Object {product1: 1}   //click on product1, quantity = 1
Object {product1: 2}   //click on product1 again, quantity = 1 + 1 = 2
Object {product1: 2, product2: 1}  //click on product2

私は何が欠けていますか？

http://jsfiddle.net/C4WuG/4/

4

3 に答える 3

0

.reduce()を使用したソリューション、それが最善の方法だとは思いません

var cart = new Array();

$(document).ready(function(){

    $('button').on('click', function() {
        var pid = $(this).attr('id');

        cart[cart.length] = {id:pid, qty:1}

        var result = cart.reduce(function(res, obj) {
            if(res.__array){
                res = {};
            }

            if(!res[obj.id]){
                res[obj.id] = {
                    qty: 0
                }
            }

            res[obj.id].qty += obj.qty;

            return res;
        }, {__array:[]})

        console.log(result)
    });
});

デモ:フィドル

また

.forEach()を使用したより単純なもの

var cart = new Array();

$(document).ready(function(){

    $('button').on('click', function() {
        var pid = $(this).attr('id');

        cart[cart.length] = {id:pid, qty:1}

        var result = {};
        cart.forEach(function(obj, index){
            if(!result[obj.id]){
                result[obj.id] = { qty: 0 }
            }
            result[obj.id].qty += obj.qty;
        });

        console.log(result)
    });
});

デモ:フィドル

于 2013-04-20T06:27:25.347 に答える
0

Object {product1: 2, product2: 1}メソッドを使用してのような出力が必要な場合はreduce、以下を試してください。初期値を次のように渡します{}

reduce メソッドの構文は次のようになります

[].reduce(
   function( previousValue, currentValue, index,  array ){},
   initialValue 
);

そして私たちの解決策は

var cart = [];

$(document).ready(function(){

     $('button').on('click', function() {

            cart.push( { id:$(this).attr('id'), qty:1 } );

            var result = cart.reduce(function(res, obj) {

                if (!(obj.id in res )) {
                    res[obj.id] = 0
                }     

                return ( res[obj.id] += obj.qty ) && res ; 

            }, {} )

            console.log( result )
    });
});

そしてフィドルhttp://jsfiddle.net/C4WuG/8/

于 2013-04-20T06:44:15.433 に答える
0

それはあなたの問題を解決しませんreduceがreduce、適切なツールではありません. これに対する別のアプローチを提案してもよろしいですか？cartここでは、製品が追加されるたびに全体をループするのではなく、追加ごとにカウントを同期させます。

ここでは、一度に 1 つの製品を追加していると仮定しましたが、必要に応じて増分することもできますproduct.qty。

http://jsfiddle.net/C4WuG/6/

var cart = [], count = {};

$(document).ready(function () {

    $('button').on('click', function () {
        var pid = $(this).attr('id');

        cart.push({
            id: pid,
            qty: 1
        });

        count[pid] = (count[pid] || 0) + 1;

        console.log(count);
    });
});
于 2013-04-20T06:24:50.670 に答える