Question

我已阅读并尝试过关于此主题的所有SO帖子，但由于某些原因，没有一个答案能够提供所需的效果。

我已经编写了一个购物篮程序，一旦用户点击“立即购买”按钮，我希望发出包含用户订单对象的POST请求。

问题

用户可以选择购买三种不同的商品。每当用户点击一个项目（一个html输入框）时，为了增加他们想要购买的金额，我想更新该对象，使其仅包含所选的最新金额。

以最简单的格式，篮子在启动时看起来像这样：

 var basket = {items:[
                    {item:"Trousers", quantity:1, cost:"10"},
                    {item:"Trainers", quantity:1, cost:"5"},
                    {item:"Jacket", quantity:1, cost:"30"}
                ]}

每次用户点击输入按钮我希望更新篮子，所以如果用户点击将夹克增加到3，而裤子到4，我希望对象看起来像这样：

 var basket = {items:[
                        {item:"Trousers", quantity:4, cost:"40"},
                        {item:"Trainers", quantity:1, cost:"5"},
                        {item:"Jacket", quantity:3, cost:"90"}
                    ]}

然后，如果用户决定将裤子数量减少1，为3，我希望basket.items对象看起来像这样：

 var basket = {items:[
                            {item:"Trousers", quantity:3, cost:"30"},
                            {item:"Trainers", quantity:1, cost:"5"},
                            {item:"Jacket", quantity:3, cost:"90"}
                        ]}

我已经为所有计算等编写了代码，所以这不是问题，但问题是更新basket.items只包含上面列出的三个项目，包含最新数据。

我无法使用过滤方法，因为这需要在旧版本的IE中使用。我已经尝试了this和this中列出的所有解决方案以及更多解决方案，但这些答案都没有提供我正在寻找的解决方案。

如果需要进一步的信息，请告诉我。

Answer 1

试试这个：

var basket = {
    items: [

    {
        item: "Trousers",
        quantity: 1,
        cost: "10"
    }, {
        item: "Trainers",
        quantity: 1,
        cost: "5"
    }, {
        item: "Jacket",
        quantity: 1,
        cost: "30"
    }]
};

function updateBasket(item) {
    basket.items = basket.items.map(function (product) {
        if (product.item == item.item) return item;
        else return product;
    });
}

updateBasket({
    item: "Jacket",
    quantity: 9,
    cost: "30"
});
updateBasket({
    item: "Trainers",
    quantity: 9,
    cost: "30"
});
console.log(basket)

Answer 2

费用应该是一个数字，而不是字符串。
如果您没有为1件商品的价格保留全局对象，那么一旦您更新了basket对象，您将丢失1件商品的价格信息而您不知道要多少钱提高价格。

考虑到同样的情况，以下是我对变更的建议：

 var basket = {items:[
                        {item:"Trousers", quantity:4, itemCost:40, totalCost:40},
                        {item:"Trainers", quantity:1, itemCost:5, totalCost:5},
                        {item:"Jacket", quantity:3, itemCost:90, totalCost:90},
                    ]}

function updateQuantity(itemName, qIncreaseBy, qDecreaseBy){
    console.log(basket);
    for(var propt in basket.items){
        if(basket.items[propt].item == itemName){
            if(qIncreaseBy != 0){
                basket.items[propt].quantity = (basket.items[propt].quantity + 1);
                basket.items[propt].totalCost = (basket.items[propt].totalCost + basket.items[propt].itemCost);
            } else{
                basket.items[propt].quantity = (basket.items[propt].quantity - 1);
                basket.items[propt].totalCost = (basket.items[propt].totalCost - basket.items[propt].itemCost);
            }
            break;
        }
    }
    console.log(basket);
}

用法：

updateQuantity("Trainers", 0, 1);  //To add item
updateQuantity("Trainers", 1, 0)  //To remove item

Answer 3

如果情况不是这样，那么你不知道是否有必要构建对象数组，例如

basket = { items : { item_1 : { quantity: 1, cost: 1 } } }

所以更新篮子就是

function updateBasket(item, value) {
  // item -> item_1
  // value - > { quantity: 2, cost: 2}
  basket['items'][item] = value;
}

Answer 4

老实说，如果您以稍微不同的方式保存数据，我认为问题可以解决。例如，像这样的东西

var products  = {
    trousers:0,
    jackets:0,
    trainers:0,
};

var prices = {
    trainers:5,
    jackets: 30,
    trousers: 10
}


//to increase the amount of products after user event
products.jackets  +=2;
products.trainers +=3;
products.trousers +=1;

//finally generate your desired format
var basket = {items:[]};

for(product in products){
   basket.items.push({
       item: product,
       quantity: products[product],
       cost: products[product]*prices[product]
   });
}

console.log(basket);

你可以看到篮子现在是你想要的格式：）

从数组javascript中的对象中删除和替换项

4 个答案: