四 jq购物车

1 购物车，其实就是把用户选择商品的关键信息在详情页（或含有加入购物车的页面）储存起来，拿到购物车页面展示，对，就是这么简单......

so我们的工作就三部

• 把购物车需要的数据储存起来
• 购物车页面拿到数据并展示以及一些计算操作
• 把购物车中要买的信息记录下来并传到订单页

一 商品数据分析与储存形式

1、商品需要的数据 goods
商品编号： goods-id
商品名称： goods-name
商品价格： goods-price
商品款式： goods-style
商品尺码： goods-size
商品库存： goods-stock
商品数量 ： goods-amount
商品图片： goods-img
..............................

一件商品： {}  
n件商品： [{},{},{}]
n件商品： {10001:{},10002:{}}

2 具体实践

① {10001:{},10002:{}}形式

  思路：我们先说第一种储存方式的，var cart = {}
        {
              "1001":{
                                goods-id: 1001,
                                  goods_amount:10.....
                      }
       }
    1 我们先读取本地储存（可以是cookie,可以使h5webstorage,你知道他们的却别即可
    var cart = $.cookie("mls-cart")  | '{}'; //如果有，拿过来，没有，拿到的是{}，也就是创建了一个对象
    cart = JSON.parse(cart);
    //创建数据结构
     //判断cart是否已存在当前商品,不存在，加入当前商品，存在，数量+当前所选数量

    if(!cart[goodsId]){
              cart[goodsId] = {
                    goodsId: goodsId,
                    goodsAmount: parseInt( amount )
                };
    }else{
         cart[goodsId].goodsAmount += parseInt(amount);   

    }
    //写入到cookie

② [{},{}]形式，这是大多数网站,app都通用的形式
var cart = [{}];

       1 还是先读取本地储存
        var cartHistory = localStorage.getItem('zdh-cart');
        
         //拿到的数组可能有值，也可能为undefined,（第一次，没存呀那沃恩要做判断了）
         var cart = (cartHistory)?JSON.parse(cartHistory):new Array();

          //拿到要储存的对象
           var goodsInfo={
                        goodsId: id,
                        goodsAmount: goodsnum
        };
            var isExisted=false; //是否存在的
          //遍历购物车数组，看是否是第一次储存，（就是看他有没有，也就是数组中每个对象的id===我们这儿的id，就是有，反之没有）
            for(var i=0; i<cart.length; i++){
                        if (cart[i].goodsId === goodsInfo.goodsId) {
                            // 更新商品信息
                            cart[i].goodsAmount += parseInt(goodsInfo.goodsAmount);
                            isExisted = true;
                            break; 
                        }
                    }
      //如果不存在，则直接添加到购物车
          if(!isExisted){
                        cart.push(goodsInfo);
                    }
          // 将购物车信息存储到本地
                    localStorage.setItem("zdh-cart",JSON.stringify(cart));