2017-08-04 64 views
0

我的要求是,如果我在客戶端爲訂閱選擇單個類別,那麼我將發送與該類別相關的類別詳細信息,並將它們存儲在我的後端添加一些id,然後推回到客戶端,以將這些類別顯示在我的用戶的某個部分中。所以,我會得到像下面這數組從我的後端數據庫來如何在javascript中構建一個沒有重複對象的嵌套數組

[ 
    { 
    catId:"veg", 
    catName:"vegetarian", 
    subCatId:"potato", 
    subcatName:"potatoes" 
    }, 
    { 
    catId:"veg", 
    catName:"vegetarian", 
    subCatId:"tomato", 
    subcatName:"tomatoes" 
    }, 
    { 
    catId:"nonveg", 
    catName:"Non vegetarians", 
    subCatId:"chicken", 
    subcatName:"chicken" 
    }, 
    { 
    catId:"apetizer", 
    catName:"Apitizers", 
    subCatId:"veg-apitizer", 
    subcatName:"vegetarian Apitizers" 
    } 
] 

現在我要像下面的合成陣列,

[ 
    { 
     catId:"veg", 
     catName:"vegetarian", 
     subcatsArray:[ 
        { 
         catId:"veg", 
         catName:"vegetarian", 
         subCatId:"potato", 
         subcatName:"potatoes" 
         }, 
         { 
         catId:"veg", 
         catName:"vegetarian", 
         subCatId:"tomato", 
         subcatName:"tomatoes" 
         } 
        ] 
    }, 
    { 
     catId:"nonveg", 
     catName:"Non vegiterians", 
     subcatsArray:[ 
        { 
         catId:"nonveg", 
         catName:"Non vegiterians", 
         subCatId:"chicken", 
         subcatName:"chicken" 
         } 
        ] 
    },{ 
     catId:"apetizer", 
     catName:"Apitizers", 
     subcatsArray:[ 
        { 
         catId:"apetizer", 
         catName:"Apitizers", 
         subCatId:"veg-apitizer", 
         subcatName:"vegetarian Apitizers" 
         } 
        ] 
    } 

    ] 

如果再次,我訂閱了另一個子類別,那麼我想將該子類別推入subcatsArray的相關類別數組,如上面的模型結構所示。

注:我顯示的最終認購的另一頁類別中,因爲我訂閱類別,子類別在單獨的頁面

+0

還張貼您試圖代碼。 –

+0

另外我不認爲你需要在'subcatsArray'中使用'catId'和'catName',因爲它只是重複數據。 –

回答

1

這裏是一個啓動什麼,我認爲你是後。

var catarray = [];//your array 
var formatedArray = [];  
function sort() { 

     for (var i=0; i < catarray.length; i++) { 
      addToFormated(Stored_Rights[i].catId,Stored_Rights[i].catName, Stored_Rights[i].subCatId,Stored_Rights[i].subcatName); 

     } 
    } 
    function addToFormated(a,b,c,d) { 
     var found = false; 
     for (var i=0; i < formatedArray.length; i++) { 
      if (formatedArray[i].catId == a) { 
       found = true; 
      //add the cat food to this area of the array 
      } 
     } 
     if (!found) { 
      //create a new catagory and add 
     } 
    } 
1

您可以使用嵌套哈希表,並只取出不在結果集中的部分。

var array = [{ catId: "veg", catName: "vegetarian", subCatId: "potato", subcatName: "potatoes" }, { catId: "veg", catName: "vegetarian", subCatId: "potato", subcatName: "potatoes" }, { catId: "veg", catName: "vegetarian", subCatId: "tomato", subcatName: "tomatoes" }, { catId: "nonveg", catName: "Non vegetarians", subCatId: "chicken", subcatName: "chicken" }, { catId: "apetizer", catName: "Apitizers", subCatId: "veg-apitizer", subcatName: "vegetarian Apitizers" }], 
 
    hash = Object.create(null), 
 
    result = []; 
 

 
array.forEach(function (o) { 
 
    if (!hash[o.catId]) { 
 
     hash[o.catId] = { _: [] }; 
 
     result.push({ catId: o.catId, catName: o.catName, subcatsArray: hash[o.catId]._ }); 
 
    } 
 
    if (!hash[o.catId][o.subCatId]) { 
 
     hash[o.catId][o.subCatId] = o; 
 
     hash[o.catId]._.push(o); 
 
    } 
 
}); 
 

 
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

0
<div id="log"></div> 
<script> 
var source = [{ 
     catId: "veg", 
     catName: "vegetarian", 
     subCatId: "potato", 
     subcatName: "potatoes" 
    }, 
    { 
     catId: "veg", 
     catName: "vegetarian", 
     subCatId: "tomato", 
     subcatName: "tomatoes" 
    }, 
    { 
     catId: "nonveg", 
     catName: "Non vegetarians", 
     subCatId: "chicken", 
     subcatName: "chicken" 
    }, 
    { 
     catId: "apetizer", 
     catName: "Apitizers", 
     subCatId: "veg-apitizer", 
     subcatName: "vegetarian Apitizers" 
    } 
]; 

var treestructure = []; // keep this in global scope 

window.onload = function() { 
    flat2tree(source); 
    document.getElementById('log').innerHTML = JSON.stringify(treestructure); 
} 

function flat2tree(source) { 
    for (var i in source) { 
     var cat = source[i]['catId']; 
     // see if the cat is already in the treestructure 
     var index = inTree(treestructure, 'catId', cat); 
     if (index > -1) { 
      // add this item to the subarray 
      treestructure[index]['subcatsArray'].push(source[i]); 
     } else { 
      // new category, add to tree 
      treestructure.push({ 
       catId: cat, 
       catName: source[i]['catName'], 
       subcatsArray: [ 
        source[i] 
       ] 
      }); 
     } 
    } 
} 

// a kind of inArray, or indexOf, but especially for this kind of tree. returns -1 for 'not found', else returns the index 
function inTree(obj, tag, value) { 
    for (var i in obj) { 
     if (obj[i][tag] == value) { 
      return i; 
     } 
    } 
    return -1; 
} 
</script> 
0

隨着ES6你可以做一些通過收集地圖一樣具有降低哈希的CATID,然後蔓延的值到一個數組短。或者您可以使用閉包並遵循Ninas模式。但是,Nina的解決方案更快更優雅,因爲她的解決方案只包含一個循環,而且是解決問題的最直接解決方案。

const catagoriseDuplicates = list => [...list.reduce((map, list) => 
 
    (map.has(list.catId) ? map.get(list.catId).subCatArray.every(x => x.subCatId !== list.subCatId) ? map.get(list.catId).subCatArray.push(list) : null : map.set(list.catId, { 
 
    catId: list.catId, 
 
    catName: list.catName, 
 
    subCatArray: [] 
 
    }) && map.get(list.catId).subCatArray.push(list), map), new Map()).values()]; 
 

 

 
let list = [{ 
 
    catId: "veg", 
 
    catName: "vegetarian", 
 
    subCatId: "potato", 
 
    subcatName: "potatoes" 
 
    }, 
 
    { 
 
    catId: "veg", 
 
    catName: "vegetarian", 
 
    subCatId: "tomato", 
 
    subcatName: "tomatoes" 
 
    }, 
 
    { 
 
    catId: "nonveg", 
 
    catName: "Non vegetarians", 
 
    subCatId: "chicken", 
 
    subcatName: "chicken" 
 
    }, 
 
    { 
 
    catId: "apetizer", 
 
    catName: "Apitizers", 
 
    subCatId: "veg-apitizer", 
 
    subcatName: "vegetarian Apitizers" 
 
    } 
 
] 
 
console.log(catagoriseDuplicates(list));
.as-console-wrapper { 
 
    max-height: 100% !important; 
 
    top: 0; 
 
}

關閉使用縮小

const catagoriseDuplicates = list => list.reduce((hash => (map, list) => { 
 
    !hash[list.catId] ? (hash[list.catId] = { 
 
     _: [] 
 
    }, 
 
    map.push({ 
 
     catId: list.catId, 
 
     catName: list.catName, 
 
     subCatsArray: hash[list.catId]._ 
 
    })) : null; 
 
    !hash[list.catId][list.subCatId] ? (hash[list.catId][list.subCatId] = list, 
 
    hash[list.catId]._.push(list)) : null; 
 
    return map 
 
})(Object.create(null)), []); 
 

 

 
let list = [{ 
 
    catId: "veg", 
 
    catName: "vegetarian", 
 
    subCatId: "potato", 
 
    subcatName: "potatoes" 
 
    }, { 
 
    catId: "veg", 
 
    catName: "vegetarian", 
 
    subCatId: "potato", 
 
    subcatName: "potatoes" 
 
    }, 
 
    { 
 
    catId: "veg", 
 
    catName: "vegetarian", 
 
    subCatId: "tomato", 
 
    subcatName: "tomatoes" 
 
    }, 
 
    { 
 
    catId: "nonveg", 
 
    catName: "Non vegetarians", 
 
    subCatId: "chicken", 
 
    subcatName: "chicken" 
 
    }, 
 
    { 
 
    catId: "apetizer", 
 
    catName: "Apitizers", 
 
    subCatId: "veg-apitizer", 
 
    subcatName: "vegetarian Apitizers" 
 
    } 
 
] 
 
console.log(catagoriseDuplicates(list));

相關問題