Related
I have an array with objects
const data = [{
"id": 19887003,
"category": "Shops",
"details": "Shoe Store",
"star": 2,
"subCategory": "Outlet",
},
{
"id": 19234003,
"category": "Shops",
"details": "Shoe Point",
"star": 2,
"subCategory": "Outlet",
},
{
"id": 190456003,
"category": "Food",
"details": "Korean",
"star": 4,
"subCategory": "Restaurant",
},
{
"id": 190111003,
"category": "Food",
"details": "Chinese",
"star": 4,
"subCategory": "Restaurant",
},
{
"id": 1902303,
"category": "Food",
"details": "Lounge",
"star": 4,
"subCategory": "Bar",
}]
this is a small piece but the structure is the same for all objects: i have a category, with multiple subcategories and sometimes the subcategory has details..for example the category food has the subcategory restourant and restourant has many types (chinese, korean).
My goal is to get a structure like that:
[
{
"category": "Food",
"subCategories": [
{
"Subcategory": "Bar",
"details": [
{
name: "Lounge",
star: 2,
id: 1902303
}
]
},
{
"Subcategory": "Restaurant",
"details": [
{
name: "Chinese",
star: 4,
id: 190111003
},
{
name: "Korean",
star: 4,
id: 190456003
}
]
}
},
{
"category": "Shops",
"subCategories": [
{
"Subcategory": "Outlet",
"details": [
{
name: "Shoe Store",
star: 2,
id: 19887003
},
{
name: "Shoe Point",
star: 2,
id: 19234003
}
]
}
]
}
]
My attempt:
const groupedCategories = data.reduce((accumulator, element) => {
const detail = element.details;
const category = element.category;
const subCategory = element.subCategory;
if (accumulator[category]){
return {
...accumulator,
[category]: {
...accumulator[category],
subCategories: [...new Set([...accumulator[category].subCategories,subCategory])],
}
}}
else {
return {
...accumulator,
[category]: {
subCategories: [subCategory],
}
}
}
}, {});
I tried use reduce method like that but this is not the exact structure I desire in particular how to put details fields into subcategories.
Thanks
array.reduce seems to be the right choice. Simplest approach is to have double if statement to check if previous element (category and subcategory exists) and either push into existing array or create new object on upper level:
const data = [{
"id": 19887003,
"category": "Shops",
"details": "Shoe Store",
"star": 2,
"subCategory": "Outlet",
},
{
"id": 19234003,
"category": "Shops",
"details": "Shoe Point",
"star": 2,
"subCategory": "Outlet",
},
{
"id": 190456003,
"category": "Food",
"details": "Korean",
"star": 4,
"subCategory": "Restaurant",
},
{
"id": 190111003,
"category": "Food",
"details": "Chinese",
"star": 4,
"subCategory": "Restaurant",
},
{
"id": 1902303,
"category": "Food",
"details": "Lounge",
"star": 4,
"subCategory": "Bar",
}]
let output = data.reduce((acc,cur) => {
let {category, subCategory, ...rest} = cur;
let prevCat = acc.find(x => x.category === category);
if(!prevCat){
acc.push({category, subCategories: [{subCategory, details: [rest]}]});
} else {
let prevSubCat = prevCat.subCategories.find(x => x.subCategory === subCategory);
if(!prevSubCat) {
prevCat.subCategories.push({subCategory, details: [rest]});
} else {
prevSubCat.details.push(rest);
}
}
return acc;
}, []);
console.log(output);
I have the following array of objects with nested elements in the children property. I need to get objects by their id if the id matches.
[
{
"id": 10,
"name": "Scenarios",
"value": null,
"children": [
{
"id": 12,
"name": "Scenario status",
"value": null,
"children": []
}
]
},
{
"id": 11,
"name": "Forecast source",
"value": null,
"children": []
},
{
"id": 16787217,
"name": "Item#Cust",
"value": null,
"children": [
{
"id": 16787230,
"name": "Customer",
"value": null,
"children": [
{
"id": 16787265,
"name": "Site",
"value": null,
"children": []
},
{
"id": 16787291,
"name": "Commercial Network",
"value": null,
"children": []
},
{
"id": 16787296,
"name": "Distribution Site",
"value": null,
"children": []
}
]
},
{
"id": 16787245,
"name": "Item#Site",
"value": null,
"children": [
{
"id": 16787266,
"name": "Family#Warehouse",
"value": null,
"children": []
}
]
},
{
"id": 16787254,
"name": "Item",
"value": null,
"children": [
{
"id": 16787260,
"name": "Family",
"value": null,
"children": [
{
"id": 16787264,
"name": "Product line",
"value": null,
"children": []
}
]
},
{
"id": 16787261,
"name": "Group 1",
"value": null,
"children": []
}
]
}
]
},
{
"id": 16787267,
"name": "Supplier",
"value": null,
"children": []
},
{
"id": 16787297,
"name": "SKU",
"value": null,
"children": []
}
]
If no match on root element is found, the function should lookup its children to see if there is a match, and the first children match should be pushed on the root level.
For exemple, I have a list of ids: [12, 16787217, 16787245, 16787266]
The function should return only objects where ids matches while keeping hierarchy if matching parent id have matching children id, so it should return this:
[
{
"id": 12,
"name": "Scenario status",
"value": null,
"children": []
},
{
"id": 16787217,
"name": "Item#Cust",
"value": null,
"children": [
{
"id": 16787245,
"name": "Item#Site",
"value": null,
"children": [
{
"id": 16787266,
"name": "Family#Warehouse",
"value": null,
"children": []
}
]
}
]
}
]
As for now, I can get only the first level elements if they are found with this function:
filterArray(array: Array<any>, ids: Array<number>) {
array = array.filter(el => ids.includes(el.id));
for (let i = 0; i < array.length; i++) {
this.filterArray(array[i].children, ids);
}
console.log(array);
}
Anyone have an idea on how to achieve this?
You could reduce the array and take the nodes with found id and children or only the children at the base level.
const
find = (r, { children = [], ...o }) => {
children = children.reduce(find, []);
if (ids.includes(o.id)) r.push({ ...o, children });
else if (children.length) r.push(...children);
return r;
},
data = [{ id: 10, name: "Scenarios", value: null, children: [{ id: 12, name: "Scenario status", value: null, children: [] }] }, { id: 11, name: "Forecast source", value: null, children: [] }, { id: 16787217, name: "Item#Cust", value: null, children: [{ id: 16787230, name: "Customer", value: null, children: [{ id: 16787265, name: "Site", value: null, children: [] }, { id: 16787291, name: "Commercial Network", value: null, children: [] }, { id: 16787296, name: "Distribution Site", value: null, children: [] }] }, { id: 16787245, name: "Item#Site", value: null, children: [{ id: 16787266, name: "Family#Warehouse", value: null, children: [] }] }, { id: 16787254, name: "Item", value: null, children: [{ id: 16787260, name: "Family", value: null, children: [{ id: 16787264, name: "Product line", value: null, children: [] }] }, { id: 16787261, name: "Group 1", value: null, children: [] }] }] }, { id: 16787267, name: "Supplier", value: null, children: [] }, { id: 16787297, name: "SKU", value: null, children: [] }],
ids = [12, 16787217, 16787245, 16787266],
result = data.reduce(find, []);
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
You could also try this
let data = [
{
"id": 10,
"name": "Scenarios",
"value": null,
"children": [
{
"id": 12,
"name": "Scenario status",
"value": null,
"children": []
}
]
},
{
"id": 11,
"name": "Forecast source",
"value": null,
"children": []
},
{
"id": 16787217,
"name": "Item#Cust",
"value": null,
"children": [
{
"id": 16787230,
"name": "Customer",
"value": null,
"children": [
{
"id": 16787265,
"name": "Site",
"value": null,
"children": []
},
{
"id": 16787291,
"name": "Commercial Network",
"value": null,
"children": []
},
{
"id": 16787296,
"name": "Distribution Site",
"value": null,
"children": []
}
]
},
{
"id": 16787245,
"name": "Item#Site",
"value": null,
"children": [
{
"id": 16787266,
"name": "Family#Warehouse",
"value": null,
"children": []
}
]
},
{
"id": 16787254,
"name": "Item",
"value": null,
"children": [
{
"id": 16787260,
"name": "Family",
"value": null,
"children": [
{
"id": 16787264,
"name": "Product line",
"value": null,
"children": []
}
]
},
{
"id": 16787261,
"name": "Group 1",
"value": null,
"children": []
}
]
}
]
},
{
"id": 16787267,
"name": "Supplier",
"value": null,
"children": []
},
{
"id": 16787297,
"name": "SKU",
"value": null,
"children": []
}
]
let ids = [12, 16787217, 16787245, 16787266]
let filterArray = (mArray, ids) => {
let result = []
for (const x of mArray) {
if (ids.includes(x.id)) {
let element = {...x, children: []}
let childrenFounds = []
if (x.children.length) {
childrenFounds = filterArray(x.children, ids)
if (childrenFounds.length) element.children.push(...childrenFounds)
}else {
delete element.children
}
result.push(element)
} else if (x.children.length) {
let found = filterArray(x.children, ids)
if (found.length) result.push(...found)
}
}
return result
}
let res = filterArray(data, ids)
console.log('res', res)
I have two objects obj1 and obj2, how to loop through array key children and if code name matches, then add the name key in the object obj2, get the object.
How to loop through object of objects and match the key and push the key to get the new object in javascript
function newObject(obj1, obj2) {
var result = obj1.map(e => {
if ('children' in e)
e.children = e.children.map(child => {
if ('children' in child)
child.children = child.children.map(c => {
name: c.name
});
return child;
});
return e;
})
return result
}
var obj1 = [{
"id": 1,
"item": "node1",
"children": [{
"id": 2,
"code": "countries",
"title": "Country",
"children": [{
"cid": 12,
"code": "S1",
"name": "SG",
"children": [{
"id": 4,
"code": "C1",
"name": "City"
}]
},
{
"cid": 13,
"code": "S2",
"name": "TH"
}
]
},
{
"id": 2,
"code": "Groceries",
"title": "Grocery",
"children": [{
"cid": 11,
"code": "G1",
"name": "Fruits"
},
{
"cid": 10,
"code": "G2",
"name": "Vegetables"
}
]
}, {
"id": 3,
"code": "lists",
"title": "Option"
}
]
}];
var obj2 = [{
id: 1,
code: "G1",
status: "active"
},
{
id: 2,
code: "S2",
status: "inactive"
},
{
id: 3,
code: "C1",
status: "active"
}
];
console.log(this.newObject(obj1, obj2));
Expected Output
[
{id:1, name: "Fruits",code:"G1", status:"active"},
{id:2, name: "TH",code:"S2", status:"inactive"},
{id:3, name: "city",code:"C1", status:"active"}
]
you can check this code
I fixed your object and you can find your expectation in the console
I have the json Like below, i want to get the unique child sub nodes for each main nodes
{
"name": "MENUS",
"value": "",
"children": [
{
"name": "MENU1",
"value": {},
"children": [
{
"name": "SubMenu1",
"value": {},
"children": [
{
"name": "SubMenu2",
"value": {},
"children": [
{
"name": "SubMenu3",
"value": {
"Pld": "1"
},
"children": []
}
]
}
]
}
]
},
{
"name": "MENU1",
"value": {},
"children": [
{
"name": "SubMenu1",
"value": {},
"children": [
{
"name": "SubMenu2",
"value": {},
"children": [
{
"name": "SubMenu4",
"value": {
"Pld": "1"
},
"children": []
}
]
}
]
}
]
}
]
}
I wanted the JSON like below format for each main nodes i want unique sub nodes means the subnode should not be a duplicate in the JSON.
{
"name": "MENUS",
"value": "",
"children": [
{
"name": "MENU1",
"value": {},
"children": [
{
"name": "SubMenu1",
"value": {},
"children": [
{
"name": "SubMenu2",
"value": {},
"children": [
{
"name": "SubMenu3",
"value": {
"Pld": "1"
},
"children": []
},
{
"name": "SubMenu4",
"value": {
"Pld": "1"
},
"children": []
}
]
}
]
}
]
}
]
}
Could you please anyone help me how to get the unique hierarchical tree JSON.
EDIT::Adding POJO classes for reference
This is how my java pojo looks like,
MenuTree.java
private String name;
private String value;
private Children[] children;
Children.java
private String name;
private Value value;
private Children[] children;
Value.java
private String Pld;
You could use an iterative and recursive approach by searching eachlevel for existing name and append the array with new objects if not found.
var object = { name: "MENUS", value: "", children: [{ name: "MENU1", value: {}, children: [{ name: "SubMenu1", value: {}, children: [{ name: "SubMenu2", value: {}, children: [{ name: "SubMenu3", value: { Pld: "1" }, children: [] }] }] }] }, { name: "MENU1", value: {}, children: [{ name: "SubMenu1", value: {}, children: [{ name: "SubMenu2", value: {}, children: [{ name: "SubMenu4", value: { Pld: "1" }, children: [] }] }] }] }] },
unique = [object].reduce(function iter(r, { name, value, children = [] }) {
var object = r.find(o => o.name === name);
if (!object) {
object = { name, value };
r.push(object);
}
children.reduce(iter, object.children = object.children || []);
return r;
}, []);
console.log(unique);
.as-console-wrapper { max-height: 100% !important; top: 0; }
I'm working with the following data structure:
"data": {
"products": [
[
{
"category": "A",
"items": [
{
"name": "Aloe",
"price": 10
},
{
"name": "Apples",
"price": 5
}
]
},
{
"category": "B",
"items": [
{
"name": "Bread",
"price": 5
}
]
}
],
[
{
"category": "C",
"items": [
{
"name": "Candy",
"price": 5
},
{
"name": "Crayon",
"price": 5
}
]
},
{
"category": "D",
"items": [
{
"name": "Dice",
"price": 5
},
{
"name": "Doll",
"price": 10
}
]
}
]
]
}
I'd like extract parts of it to flatten so the results is as follows:
[
{
"name": "Aloe",
"price": 10
},
{
"name": "Apples",
"price": 5
},
{
"name": "Bread",
"price": 5
},
{
"name": "Candy",
"price": 5
},
{
"name": "Crayon",
"price": 5
},
{
"name": "Dice",
"price": 5
},
{
"name": "Doll",
"price": 10
}
]
How can I accomplish this?
I have tried this:
for (var sets in data.products) {
for (var categories in sets) {
for (var items in categories) {
for (var item in items) {
// assemble new array
}
}
}
}
... but had problems looping through the children objects. I've found a couple other similar questions, but they seem to address simpler data structures, and flatten the entire object rather than parts of it.
Any pointers would be appreciated.
input.data.products. ....
maube Change in row 1 depend on your variable name
var result =[]
input.data.products.forEach(function (product){
product.forEach(function(productinfo){
productinfo.items.forEach(function (item){
result.push(item)
})
})
})
You will have to try something like this:
Logic:
Loop over data.products to get individual product details.
Sine details are also arrays, loop over them and return items from them.
The trick is, you will have to use Array.prototype.concat to merge arrays returned, to flatten them.
var data = {
"products": [
[{
"category": "A",
"items": [{
"name": "Aloe",
"price": 10
},
{
"name": "Apples",
"price": 5
}
]
},
{
"category": "B",
"items": [{
"name": "Bread",
"price": 5
}]
}
],
[{
"category": "C",
"items": [{
"name": "Candy",
"price": 5
},
{
"name": "Crayon",
"price": 5
}
]
},
{
"category": "D",
"items": [{
"name": "Dice",
"price": 5
},
{
"name": "Doll",
"price": 10
}
]
}
]
]
}
var result = [].concat.apply([], data.products.map(function(product){
return [].concat.apply([], product.map(function(p){
return p.items
}))
}))
console.log(result)
I have assigned your JSON object for data to a variable first. See the code below:
var pro={
"products": [
[
{
"category": "A",
"items": [
{
"name": "Aloe",
"price": 10
},
{
"name": "Apples",
"price": 5
}
]
},
{
"category": "B",
"items": [
{
"name": "Bread",
"price": 5
}
]
}
],
[
{
"category": "C",
"items": [
{
"name": "Candy",
"price": 5
},
{
"name": "Crayon",
"price": 5
}
]
},
{
"category": "D",
"items": [
{
"name": "Dice",
"price": 5
},
{
"name": "Doll",
"price": 10
}
]
}
]
]
}
var flatArray=[];
for(var i=0; i<pro.products.length; i++){
for(var j=0; j<pro.products[i].length;j++){
for(var k=0; k<pro.products[i][j].items.length;k++){
flatArray.push(pro.products[i][j].items[k]);
}
}
}
The flatArray will be your required flattened array of objects. Hope this is clear enough.
You can use array#reduce, array#forEach and array#concat.
var input = { data: { products: [[{ category: "A", items: [{ name: "Aloe", price: 10 }, { name: "Apples", price: 5 }] }, { category: "B", items: [{ name: "Bread", price: 5 }] }], [{ category: "C", items: [{ name: "Candy", price: 5 }, { name: "Crayon", price: 5 }] }, { category: "D", items: [{ name: "Dice", price: 5 }, { name: "Doll", price: 10 }] }]] } };
const result = input.data.products.reduce((res, arr) => {
arr.forEach( o => res = res.concat(o.items));
return res;
},[]);
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
You could use a recursive approach by checking the items property or return the result of reduced properties. This approach works for any depth with an expected items property at the end.
function flat(object) {
return object.items || Object.keys(object).reduce(function (r, k) {
return r.concat(flat(object[k]));
}, []);
}
var object = { data: { products: [[{ category: "A", items: [{ name: "Aloe", price: 10 }, { name: "Apples", price: 5 }] }, { category: "B", items: [{ name: "Bread", price: 5 }] }], [{ category: "C", items: [{ name: "Candy", price: 5 }, { name: "Crayon", price: 5 }] }, { category: "D", items: [{ name: "Dice", price: 5 }, { name: "Doll", price: 10 }] }]] } }
console.log(flat(object));
.as-console-wrapper { max-height: 100% !important; top: 0; }