finding a value belongs to array or not in javascript - javascript

I have following JavaScript Array
business: [{
"id": 22,
"name": "Private",
"max_mem": 0,
"gen_roomtype_id": 4,
"status": 1,
"type": 0,
"set_value": 1
},
{
"id": 6,
"name": "Standard ward",
"max_mem": 0,
"gen_roomtype_id": 2,
"status": 1,
"type": 0,
"set_value": 1
},
{
"id": 7,
"name": "Semi Private",
"max_mem": 0,
"gen_roomtype_id": 3,
"status": 1,
"type": 0,
"set_value": 1
}],
"gen": [{
"id": 5,
"name": "laboratory",
"description": "",
"sharing": 0,
"set_value": 2
}],
And i have a idArray as following
idArray: [5, 7]
i would like to know whether the idArray values are belongs to "gen" Array or
"business" Array.


You can use the function every
This approach assumes the input data is an object.
var obj = { business: [{ "id": 5, "name": "Private", "max_mem": 0, "gen_roomtype_id": 4, "status": 1, "type": 0, "set_value": 1 }, { "id": 6, "name": "Standard ward", "max_mem": 0, "gen_roomtype_id": 2, "status": 1, "type": 0, "set_value": 1 }, { "id": 7, "name": "Semi Private", "max_mem": 0, "gen_roomtype_id": 3, "status": 1, "type": 0, "set_value": 1 } ], "gen": [{ "id": 5, "name": "laboratory", "description": "", "sharing": 0, "set_value": 2 }]
};
var idArray = [5, 7];
var resultBusiness = idArray.every(n => obj.business.some(b => b.id === n));
var resultGen = idArray.every(n => obj.gen.some(b => b.id === n));
console.log("All in business: ", resultBusiness);
console.log("All in Gen: ", resultGen);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Related

Return children tree from array

I have an array of regions the highest region has key: 10 and parent_id: null and I want to restructure this array to return a tree.
Regions tree should look like if the input is [10]
Egypt
Zone 1
Tagamo3
Giza
Helwan
Fayoum
Zone 2
Gesr ElSuis
test
Delta
Mohandeseen
Down Town
Array:
[
{
"key": 1,
"title": "Zone 1",
"parent_id": 10
},
{
"key": 2,
"title": "Zone 2",
"parent_id": 10
},
{
"key": 3,
"title": "Tagamo3",
"parent_id": 1
},
{
"key": 4,
"title": "Gesr ElSuis",
"parent_id": 2
},
{
"key": 5,
"title": "Delta",
"parent_id": 2
},
{
"key": 6,
"title": "Mohandeseen",
"parent_id": 2
},
{
"key": 7,
"title": "Giza",
"parent_id": 1
},
{
"key": 8,
"title": "Helwan",
"parent_id": 1
},
{
"key": 9,
"title": "Down Town",
"parent_id": 2
},
{
"key": 10,
"title": "Egypt",
"parent_id": null
},
{
"key": 11,
"title": "Fayoum",
"parent_id": 1
},
{
"key": 12,
"title": "test",
"parent_id": 4
}
]
The output I want to achieve if input is [10]:
[
{
"key": 10,
"title": "Egypt",
"parent_id": null,
"children": [
{
"key": 1,
"title": "Zone 1",
"parent_id": 10,
"children": [
{
"key": 3,
"title": "Tagamo3",
"parent_id": 1,
"children": []
},
{
"key": 7,
"title": "Giza",
"parent_id": 1,
"children": []
},
{
"key": 8,
"title": "Helwan",
"parent_id": 1,
"children": []
},
{
"key": 11,
"title": "Fayoum",
"parent_id": 1,
"children": []
}
]
},
{
"key": 2,
"title": "Zone 2",
"parent_id": 10,
"children": [
{
"key": 4,
"title": "Gesr ElSuis",
"parent_id": 2,
"children": [
{
"key": 12,
"title": "test",
"parent_id": 4,
"children": []
}
]
},
{
"key": 5,
"title": "Delta",
"parent_id": 2,
"children": []
},
{
"key": 6,
"title": "Mohandeseen",
"parent_id": 2,
"children": []
},
{
"key": 9,
"title": "Down Town",
"parent_id": 2,
"children": []
}
]
}
]
}
]
Regions tree should look like if the input is [1,2]
Zone 1
Tagamo3
Giza
Helwan
Fayoum
Zone 2
Gesr ElSuis
test
Delta
Mohandeseen
Down Town
Regions tree should look like if the input is [1]
Zone 1
Tagamo3
Giza
Helwan
Fayoum

May not be the most optimized, but I gave it a try:
const arr = [{key:1,title:"Zone 1",parent_id:10},{key:2,title:"Zone 2",parent_id:10},{key:3,title:"Tagamo3",parent_id:1},{key:4,title:"Gesr ElSuis",parent_id:2},{key:5,title:"Delta",parent_id:2},{key:6,title:"Mohandeseen",parent_id:2},{key:7,title:"Giza",parent_id:1},{key:8,title:"Helwan",parent_id:1},{key:9,title:"Down Town",parent_id:2},{key:10,title:"Egypt",parent_id:null},{key:11,title:"Fayoum",parent_id:1},{key:12,title:"test",parent_id:4}];
const buildTree = key => arr.filter(x => x.parent_id === key)
.map(x => ({ ...x, children: buildTree(x.key) }));
console.log(buildTree(null));
To build multiple trees, this could work:
const arr = [{key:1,title:"Zone 1",parent_id:10},{key:2,title:"Zone 2",parent_id:10},{key:3,title:"Tagamo3",parent_id:1},{key:4,title:"Gesr ElSuis",parent_id:2},{key:5,title:"Delta",parent_id:2},{key:6,title:"Mohandeseen",parent_id:2},{key:7,title:"Giza",parent_id:1},{key:8,title:"Helwan",parent_id:1},{key:9,title:"Down Town",parent_id:2},{key:10,title:"Egypt",parent_id:null},{key:11,title:"Fayoum",parent_id:1},{key:12,title:"test",parent_id:4}];
const buildNode = x => ({...x, children: buildTree(x.key)});
const buildTree = key => arr.filter(x => x.parent_id === key)
.map(buildNode);
const buildTrees = keys => arr.filter(x => keys.includes(x.key))
.map(buildNode);
console.log(buildTrees([1, 2]));

based on jcalz snippet, but requires only a single pass over the input array.
const arr = [{key:1,title:"Zone 1",parent_id:10},{key:2,title:"Zone 2",parent_id:10},{key:3,title:"Tagamo3",parent_id:1},{key:4,title:"Gesr ElSuis",parent_id:2},{key:5,title:"Delta",parent_id:2},{key:6,title:"Mohandeseen",parent_id:2},{key:7,title:"Giza",parent_id:1},{key:8,title:"Helwan",parent_id:1},{key:9,title:"Down Town",parent_id:2},{key:10,title:"Egypt",parent_id:null},{key:11,title:"Fayoum",parent_id:1},{key:12,title:"test",parent_id:4}];
/*const lookup: Record<number|"roots", Tree[]> = { roots: [] };*/
const lookup = { roots: [] };
for (const item of arr) {
// get or create the "children" array for my parent.
// parent may not be known yet, but I'm already collecting its children, my siblings.
const siblings = lookup[item.parent_id ?? "roots"] ??= [];
// add myself to that children array.
siblings.push({
...item,
// get or create my children array.
children: lookup[item.key] ??= []
});
}
// it's up to you to handle `lookup.roots.length !== 1`
console.log(lookup.roots);
.as-console-wrapper{top:0;max-height:100%!important}

Array object grouping in JavaScript

I need to convert below unformatted JSON format into formatted input. We need to find id's similar to parent id for different items inside array element of object and then need to push it into children to that id. Below is my code that needs to transform
Input
{
"0": [
{
"id": 10,
"title": "House",
"level": 0,
"children": [],
"parent_id": null
}
],
"1": [
{
"id": 12,
"title": "Red Roof",
"level": 1,
"children": [],
"parent_id": 10
},
{
"id": 18,
"title": "Blue Roof",
"level": 1,
"children": [],
"parent_id": 10
}
],
"2": [
{
"id": 17,
"title": "Blue Windoww",
"level": 2,
"children": [],
"parent_id": 12
},
{
"id": 16,
"title": "Door",
"level": 2,
"children": [],
"parent_id": 13
}
]
}
Output
[
{
"id": 10,
"title": "House",
"level": 0,
"children": [
{
"id": 12,
"title": "RedRoofff",
"level": 1,
"children": [
{
"id": 17,
"title": "Blue Windoww",
"level": 2,
"children": [],
"parent_id": 12
}
],
"parent_id": 10
},
{
"id": 18,
"title": "Blue Roof",
"level": 1,
"children": [],
"parent_id": 10
},
{
"id": 13,
"title": "Wall",
"level": 1,
"children": [
{
"id": 16,
"title": "Door",
"level": 2,
"children": [],
"parent_id": 13
}
],
"parent_id": 10
}
],
"parent_id": null
}
]
Please find the solution to above problem.

first, we track the node with Id and then we update the children array like this.
(btw, your input have a missing node, 13)
const input = {
"0": [{
"id": 10,
"title": "House",
"level": 0,
"children": [],
"parent_id": null
}, {
"id": 13,
"title": "Wall",
"level": 0,
"children": [],
"parent_id": null
}],
"1": [{
"id": 12,
"title": "Red Roof",
"level": 1,
"children": [],
"parent_id": 10
},
{
"id": 18,
"title": "Blue Roof",
"level": 1,
"children": [],
"parent_id": 10
},
],
"2": [{
"id": 17,
"title": "Blue Windoww",
"level": 2,
"children": [],
"parent_id": 12
},
{
"id": 16,
"title": "Door",
"level": 2,
"children": [],
"parent_id": 13
},
]
};
const results = [];
const mapId2Node = Object.values(input).reduce((acc, vals) => {
vals.forEach(val => {
acc[val.id] = val;
if (val.parent_id === null) {
results.push(val);
}
});
return acc;
}, {});
Object.values(input).forEach(vals => {
vals.forEach(val => {
if (val.parent_id !== null) {
mapId2Node[val.parent_id].children.push(val);
}
});
});
conosle.log(results);

How to push object array into array with key

This is my main data: (this.data)
{
"id": 7,
"name": "Revenue",
"characterCount": 1,
"maxLevel": 4,
"individualCode": "1",
"combinedCode": "02-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 1,
"parentId": 2,
},
{
"id": 8,
"name": "Revenue1",
"characterCount": 1,
"maxLevel": 4,
"individualCode": "1",
"combinedCode": "02-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 1,
"parentId": 2,
},
I have one child data: this.childData
{
"id": 14,
"name": "Sales",
"characterCount": 1,
"maxLevel": 2,
"individualCode": "1",
"combinedCode": "02-1-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 0,
"parentId": 7
},
{
"id": 15,
"name": "Sales1",
"characterCount": 1,
"maxLevel": 2,
"individualCode": "1",
"combinedCode": "02-1-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 0,
"parentId": 7
}
I want to push this childData in main this.data at specific index for eg index 0,with key "child"
means my data should look like this:
{
"id": 7,
"name": "Revenue",
"characterCount": 1,
"maxLevel": 4,
"individualCode": "1",
"combinedCode": "02-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 1,
"parentId": 2,
"child": [
{
"id": 14,
"name": "Sales",
"characterCount": 1,
"maxLevel": 2,
"individualCode": "1",
"combinedCode": "02-1-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 0,
"parentId": 7
},
{
"id": 15,
"name": "Sales1",
"characterCount": 1,
"maxLevel": 2,
"individualCode": "1",
"combinedCode": "02-1-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 0,
"parentId": 7
}
]
},
{
"id": 8,
"name": "Revenue1",
"characterCount": 1,
"maxLevel": 4,
"individualCode": "1",
"combinedCode": "02-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 1,
"parentId": 2,
},
}
I tried this this.data[index].push(this.childData);
but didnt worked for me. Is there any method so that i can achieve this?
getChildData(id,index)
{
console.log('id',id);
console.log('index',index);
const params ={};
params['parentId'] = id;
this.jvLedgerReportService.getMonthlyActivityReport(params).subscribe(data => {
this.childData = data.items
console.log("childData",this.childData);
this.data[index].push(this.childData);
console.log("after",this.data);
})
}

this.data[index]['child'] = this.childData;
OR
this.data[index].child = this.childData;

Create a "child" array key and push child data to it
var parent = [];
parent.push({
"id": 7,
"name": "Revenue",
"characterCount": 1,
"maxLevel": 4,
"individualCode": "1",
"combinedCode": "02-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 1,
"parentId": 2,
"child":[]
});
parent.push({
"id": 8,
"name": "Revenue1",
"characterCount": 1,
"maxLevel": 4,
"individualCode": "1",
"combinedCode": "02-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 1,
"parentId": 2,
"child":[]
});
var childData = [{
"id": 14,
"name": "Sales",
"characterCount": 1,
"maxLevel": 2,
"individualCode": "1",
"combinedCode": "02-1-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 0,
"parentId": 7
},
{
"id": 15,
"name": "Sales1",
"characterCount": 1,
"maxLevel": 2,
"individualCode": "1",
"combinedCode": "02-1-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 0,
"parentId": 7
}];
parent[0].child.push(childData);
console.log(parent);

var parent = [{
"id": 7,
"name": "Revenue",
"parentId": 2,
},
{
"id": 8,
"name": "Revenue1",
"parentId": 2,
}];
var child = [{
"id": 11,
"name": "Revenue",
"parentId": 7,
},
{
"id": 81,
"name": "Revenue1",
"parentId": 7,
}];
var result = parent.map(x=> {
var childData = child.filter(y=>y.parentId==x.id);
debugger;
if (childData && childData.length >0) {
x['child'] = childData;
}
return x;
});
console.log(result);
Loop throgh parent records and match the ID with child records. If it finds the records then add it into you main records as a Child property and store the data.

// Solution using callbacks
const traverse = (data, callback) => {
const visit = (node) => {
callback(node);
node.child.forEach((child) => visit(child));
}
visit(data);
}
const add = (yourData, dataToAdd, parentId) => {
traverse(yourData, (node) => {
if (node.id === parentId) {
if (!node.child) {
node.child = [...dataToAdd];
} else {
node.child = [...node.child, ...dataToAdd];
}
}
})
}
Then just call add i.e
add(this.data, this.childData, parentId);

You can achieve that like this if you want to merge the arrays using parentId:
const data = [{
"id": 7,
"name": "Revenue",
"characterCount": 1,
"maxLevel": 4,
"individualCode": "1",
"combinedCode": "02-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 1,
"parentId": 2,
},
{
"id": 8,
"name": "Revenue1",
"characterCount": 1,
"maxLevel": 4,
"individualCode": "1",
"combinedCode": "02-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 1,
"parentId": 2,
}
];
const childData = [{
"id": 14,
"name": "Sales",
"characterCount": 1,
"maxLevel": 2,
"individualCode": "1",
"combinedCode": "02-1-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 0,
"parentId": 7
},
{
"id": 15,
"name": "Sales1",
"characterCount": 1,
"maxLevel": 2,
"individualCode": "1",
"combinedCode": "02-1-1",
"isActive": true,
"topLevelId": 2,
"topLevelChildCount": 0,
"parentId": 7
}
];
const result = data.map((item) => {
const childArr = [];
childData.forEach((childItem) => {
if (item.id === childItem.parentId) {
childArr.push(childItem);
}
});
if (childArr.length > 0) {
item.child = childArr
}
return item;
});
console.log(result);

interface my_data {
[key: string]: any;
}
data: my_data {
//your data here
}
childData {
//your data here
}
this.data[index]['child'] = this.childData

Iterating over hierachical nested data and building html from it

I'm a bit mentally stuck in processing some data in JS with that I'm outputting from my API.
What the backend is outputing is a category list that can be nested up to N-th level.
What I'm trying to do is generate a nice nested structure for them so that they represent the JSON structure but in the DOM:
<div>
Women's Fashion
<div>
Women's Clothes
<div>Dresses</div>
<div>Watches</div>
<div>Etc.</div>
</div>
<div>
Watches
</div>
<div>
Jewellery
<div>Swarowski</div>
<div>Other</div>
</div>
</div>
What's a good way for me to achieve this structure?
Here is a sample of the data I'm outputing. The key stuff here is that each Category can have a M-number of subcategories and the end-depth is not actually limited.
{
"results": [
{
"id": 1,
"name": "Women's Fashion",
"hashtag": "#womensfashion",
"parent_id": null,
"parents_list": [],
"product_count": 9466,
"subcategories": [
{
"id": 2,
"name": "Womens Clothes",
"hashtag": "#womensclothes",
"parent_id": 1,
"parents_list": [
1
],
"product_count": 2940,
"subcategories": [
{
"id": 3,
"name": "Dresses",
"hashtag": "#dresses",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 4,
"name": "Tops",
"hashtag": "#womenstops",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 5,
"name": "Outwear",
"hashtag": "#womensoutwear",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 6,
"name": "Shirts",
"hashtag": "#womensshirts",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 7,
"name": "Pants and Shorts",
"hashtag": "#womenspantsandshorts",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 8,
"name": "Skirts",
"hashtag": "#skirts",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 9,
"name": "Jeans",
"hashtag": "#womensjeans",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 10,
"name": "Lingerie and Nightweare",
"hashtag": "#lingerieandnightweare",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 12,
"name": "Muslimawear",
"hashtag": "#womensmuslimawear",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 109,
"name": "Other Womensclothes",
"hashtag": "#otherwomensclothes",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
},
{
"id": 135,
"name": "Sweaters and Jackets",
"hashtag": "#womenssweatersandjackets",
"parent_id": 2,
"parents_list": [
2,
1
],
"product_count": null,
"subcategories": []
}
]
},
{
"id": 15,
"name": "Bags, Purses and Wallets",
"hashtag": "#womensbags",
"parent_id": 1,
"parents_list": [
1
],
"product_count": 1626,
"subcategories": []
},
{
"id": 16,
"name": "Shoes",
"hashtag": "#womensshoes",
"parent_id": 1,
"parents_list": [
1
],
"product_count": 811,
"subcategories": []
},
{
"id": 19,
"name": "Watches",
"hashtag": "#womenswatches",
"parent_id": 1,
"parents_list": [
1
],
"product_count": 513,
"subcategories": []
},
{
"id": 17,
"name": "Eyewear",
"hashtag": "#womenseyewear",
"parent_id": 1,
"parents_list": [
1
],
"product_count": 145,
"subcategories": []
},
{
"id": 18,
"name": "Jewellery",
"hashtag": "#womensjewellery",
"parent_id": 1,
"parents_list": [
1
],
"product_count": 289,
"subcategories": []
},
{
"id": 110,
"name": "Other Womensfashion",
"hashtag": "#otherwomensfashion",
"parent_id": 1,
"parents_list": [
1
],
"product_count": 129,
"subcategories": []
}
]
}
]
}
What I'm thinking I need to do here is declare a function which goes over a tier and returns everything. Like
process_category(category)
{
let html = [];
for(var i = 0; i < category.length; i++)
{
let nested_html = null;
if(i.subcategories.length > 0)
{
nested_html = process_category(i.subcategories);
}
let new_html = [
<ListItem
primaryText={i.name}
onTouchTap={this.click_category.bind(this, i.id)}
nestedItems={[nested_html]}
/>
];
html = [...html, ...new_html];
}
return(html);
}
EDIT:
Feeling incredibly stupud for not realizing how Javascript for/each works (was writing a python for x in categories: print x.name)
The fixed code which works but I'm not sure is optimal:
process_category(category)
{
let html = [];
for(var i in category)
{
let nested_html = null;
if(category[i].subcategories.length > 0)
{
nested_html = this.process_category(category[i].subcategories);
}
let new_html = [
<ListItem
primaryText={category[i].name}
// onTouchTap={this.click_category.bind(this, category[i].id)}
nestedItems={nested_html}
/>
];
html = [...html, ...new_html];
}
return(html);
}

I would recommend recursion:
function generateDom(obj) {
var node = document.createElement("div");
var textnode = document.createTextNode(obj.name);
node.appendChild(textnode);
for (var i in obj.subcategories) {
var subcategory = obj.subcategories[i];
node.append(generateDom(subcategory));
}
return node;
}
Working example: https://jsfiddle.net/mspinks/fdk2m2ua/

Here's a reactjs based fiddle that may get you in the right direction: https://jsfiddle.net/giladaya/yo4xa3z1/4/
Main thing to note is the use of a recursive component:
const Item = function(props) {
let { data } = props
let children
if (data.subcategories.length > 0) {
children = (
<div className={`level-${props.level}`}>
{data.subcategories.map((item, idx) =>
<Item data={item} level={props.level+1} key={`item-${idx}`}/>
)}
</div>
)
} else {
children = null
}
return (
<div>
{data.name}
{children}
</div>
)
}

iterate over heavily nested javascript object to find data

I have below JavaScript object pattern.
{
"_id": 2,
"children": [
{
"_id": 3,
"children": [
{
"_id": 5,
"children": [
{
"_id": 9,
"children": [],
"id_category": 9,
"parent_id": 5
},
{
"_id": 10,
"children": [],
"id_category": 10,
"parent_id": 5
}],
"id_category": 5,
"parent_id": 3
},
{
"_id": 6,
"children": [],
"id_category": 6,
"parent_id": 3
}],
"id_category": 3,
"parent_id": 2
},
{
"_id": 4,
"children": [
{
"_id": 7,
"children": [],
"id_category": 7,
"parent_id": 4
},
{
"_id": 8,
"children": [],
"id_category": 8,
"parent_id": 4
}],
"id_category": 4,
"parent_id": 2
}],
"id_category": 2,
"parent_id": 1
}
Now I want to get whole data for which I pass the value of _id.
For example if I pass 5, it will return the whole object of 5
{
"_id": 5,
"children": [
{
"_id": 9,
"children": [],
"id_category": 9,
"parent_id": 5
},
{
"_id": 10,
"children": [],
"id_category": 10,
"parent_id": 5
}],
"id_category": 5,
"parent_id": 3
}
The problem is Level of nesting is unlimited .
Please suggest.

Use a recursive function.
Something like this (untested, but should be ok)
function search(value, tree) {
if (tree._id === value)
return value;
var numChildren = tree.children.length;
for (var i = 0; i < numChildren; ++i) {
var result = search(value, tree.children[i]);
if (result)
return result;
}
return null;
}
var tree = {...your big json hash...};
var found = search(5, tree);
console.log(found);

Categories