48、vue商品sku幂等路径转换

  • 什么是sku
    SKU=Stock Keeping Unit(库存量单位),即库存进出计量的单位,可以是以件,盒,托盘等为单位。针对电商而言,一款商品SKU主要由商品规格组合。

  • 什么是笛卡尔乘积

    笛卡尔乘积是指在数学中,两个集合X和Y的笛卡尓积(Cartesian product),又称直积,表示为X×Y,第一个对象是X的成员而第二个对象是Y的所有可能有序对的其中一个成员 。
    假设集合A={a, b},集合B={0, 1, 2},则两个集合的笛卡尔积为{(a, 0), (a, 1), (a, 2), (b, 0), (b, 1), (b, 2)}。

假设现在有sku商品集合:

image.png

对应sku集合:

image.png

需要转换成如下格式:

image.png

案例

export default {
  //
  data(){
    return {
       // sku列表
       skulist: [
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XL加绒款",
            "skuCode": "346c252f51354bd08107b11d2961523d",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969558622210",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XL春秋薄款",
            "skuCode": "09a1089b3cd34261a0331c3daac99115",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969579593729",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XXL加绒款",
            "skuCode": "2339291237684dda9fdfd5d8d6dbf657",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969592176642",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XXL春秋薄款",
            "skuCode": "b97051c269fc42f6a8f164f852fbc3de",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969608953857",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XXXL加绒款",
            "skuCode": "43a6f3fca0f84f4487f111bdea791bb5",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XXXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969629925378",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XXXL春秋薄款",
            "skuCode": "86d780a8497d4b10a847073525f28e8f",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XXXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969646702593",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XL加绒款",
            "skuCode": "98eacc7763fb45aca2171783c75bf98c",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969667674114",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XL春秋薄款",
            "skuCode": "81178dc3048e41d29f2e8788fc88a027",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969684451330",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XXL加绒款",
            "skuCode": "e38a2fd12b34407196bc1309b8221e63",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969697034241",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XXL春秋薄款",
            "skuCode": "9c754bf1ed3f4e9f9e598727eff07173",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969722200065",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XXXL加绒款",
            "skuCode": "a71a7347c52d4656861b171ce3237e18",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XXXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969743171585",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XXXL春秋薄款",
            "skuCode": "1543c8c334624cca98780d4da6b9b9ce",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XXXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969759948802",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XL加绒款",
            "skuCode": "0811152fa3474b62afd56242508cffa3",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969776726018",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XL春秋薄款",
            "skuCode": "7c7c5267d7e145f3836331368467a50e",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969789308930",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XXL加绒款",
            "skuCode": "f74ba6db934146cd82040c77fe06363a",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969806086146",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XXL春秋薄款",
            "skuCode": "278439bd34804ad6b49a3b0e2efe6a96",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969818669057",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XXXL加绒款",
            "skuCode": "f42d9edbcee94695a0463526ec4ad3ab",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XXXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969831251969",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XXXL春秋薄款",
            "skuCode": "e344b2b1b0e44aa78047d2bc3527ad09",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XXXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749373969877389313",
            "createTime": 1705918231000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XL加绒款",
            "skuCode": "f140db7e87924d64ac02733ba0c96f4e",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361671520258",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XL春秋薄款",
            "skuCode": "324abc8359c9494ab4d08c9b847a2792",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361688297474",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XXL加绒款",
            "skuCode": "1475f287fc4a4ebeb02eec7a11add3e7",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361700880385",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XXL春秋薄款",
            "skuCode": "ac1a0ce0a7834b13aa5aefd2abf39270",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361717657602",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XXXL加绒款",
            "skuCode": "6df5be8788cc45c59d30308012cc0a0c",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XXXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361738629121",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "黑色XXXL春秋薄款",
            "skuCode": "0e53be777e3245f8b122c010b2cc7e1f",
            "skuImg": "",
            "stock": 1000,
            "specification": "黑色/XXXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361755406338",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XL加绒款",
            "skuCode": "3cd0aa7feffe42b9a3dc71176eec7b99",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361788960769",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XL春秋薄款",
            "skuCode": "cbfc8265da614a389017efaf2425c0a4",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361814126594",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XXL加绒款",
            "skuCode": "5f9fffc5ae4142e69b1f75383dc0d2b7",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361835098113",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XXL春秋薄款",
            "skuCode": "b72a7c8becb54446a6e7566397d0e53e",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361860263938",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XXXL加绒款",
            "skuCode": "1dbccc90b026446c9ad2042d7c552910",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XXXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361885429761",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "白色XXXL春秋薄款",
            "skuCode": "92ba4e52872a42389ff502421e570313",
            "skuImg": "",
            "stock": 1000,
            "specification": "白色/XXXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361910595585",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XL加绒款",
            "skuCode": "15bec0eccb8f4373a838e8d3fc48d03f",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361939955714",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XL春秋薄款",
            "skuCode": "871261d03a7744a1aa4ac7a8f45b9bce",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361969315842",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XXL加绒款",
            "skuCode": "dbbbe04f4de1485892a6299d9f5a02be",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374361994481665",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XXL春秋薄款",
            "skuCode": "684f381d4d1d4cc292af5acc53ad641b",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374362032230402",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XXXL加绒款",
            "skuCode": "a6ee01431bb44805af8319d39ff3e8e2",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XXXL/加绒款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374362061590530",
            "createTime": 1705918324000
        },
        {
            "remark": "",
            "appId": null,
            "productId": "1749373969529262082",
            "skuName": "青色XXXL春秋薄款",
            "skuCode": "5cfc1208d8b64c20bee866c087332d94",
            "skuImg": "",
            "stock": 1000,
            "specification": "青色/XXXL/春秋薄款",
            "pointAmount": 100,
            "realPayPoint": null,
            "id": "1749374362095144961",
            "createTime": 1705918324000
        }
    ]
    }
  },
  methods: {
    // 
    skuMapList(){
      let pathMap = this.getPathMap(this.skulist);
      console.log('pathMap ===== ', pathMap);
    },
    getPathMap(skus){
      const spliter = '/'
      // 用来保存的路径字典
      const pathMap = {};
      skus.forEach(sku=>{
        // 1.过滤出有效的sku因为库存会出有0的情况
        if(sku.stock){
          // 2. 拼接起来得到属性值数组例如 ['黑色','中国','10cm']
          const specs = sku.specification.split('/');
          // const specs = sku.specs.map(spec => spec.valueName);
          // 3.得到sku的子集 [[] ["蓝色"] ["中国"]["蓝色", "中国"] ["10cm"]...]
          const powerSet = this.getPowerSet(specs);
          // 将子集循环
          powerSet.forEach(set=>{
            const key = set.join(spliter);
            if(pathMap[key]){
              // 已经有key往数组追加
              pathMap[key].push(sku.id)
            }else{
              // 没有key设置一个数组
              pathMap[key] = [sku.id]
            }
          })
        }// end if
      });
      //
      return pathMap;
    },
    // 幂等算法
    getPowerSet(originalSet){
      const subSets = [];
      // We will have 2^n possible combinations (where n is a length of original set).
      // It is because for every element of original set we will decide whether to include
      // it or not (2 options for each set element).
      const numberOfCombinations = 2 ** originalSet.length;
      // Each number in binary representation in a range from 0 to 2^n does exactly what we need:
      // it shows by its bits (0 or 1) whether to include related element from the set or not.
      // For example, for the set {1, 2, 3} the binary number of 0b010 would mean that we need to
      // include only "2" to the current set.
      for (let combinationIndex = 0; combinationIndex < numberOfCombinations; combinationIndex += 1) {
        const subSet = [];
        for (let setElementIndex = 0; setElementIndex < originalSet.length; setElementIndex += 1) {
          // Decide whether we need to include current element into the subset or not.
          if (combinationIndex & (1 << setElementIndex)) {
            subSet.push(originalSet[setElementIndex]);
          }
        }
        // Add current subset to the list of all subsets.
        subSets.push(subSet);
      }
      return subSets;
    }
  },
  //
  created() {
   this.skuMapList()
  }
}

幂等路径js算法:https://raw.githubusercontent.com/trekhleb/javascript-algorithms/master/src/algorithms/sets/power-set/bwPowerSet.js

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,772评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,458评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,610评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,640评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,657评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,590评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,962评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,631评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,870评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,611评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,704评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,386评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,969评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,944评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,179评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,742评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,440评论 2 342