es6 create three dimensional array [duplicate] - javascript

This question already has answers here:
Build tree array from flat array in javascript
(34 answers)
Closed 2 years ago.
I have incoming data in this format:
const worldMap = [
{
"name": "Germany",
"parentId": null,
"type": "Country",
"value": "country:unique:key:1234",
"id": "1",
},
{
"name": "North Rhine",
"parentId": "1",
"type": "State",
"value": "state:unique:key:1234",
"id": "2",
},
{
"name": "Berlin",
"parentId": "1",
"type": "State",
"value": "state:unique:key:1234",
"id": "3",
},
{
"name": "Dusseldorf",
"parentId": "2",
"type": "city",
"value": "city:unique:key:1234",
"id": "4",
},
{
"name": "India",
"parentId": null,
"type": "Country",
"value": "country:unique:key:1234",
"id": "5",
},
];
I want the output to be something like this:
[
{
label: "Germany",
value: "country:unique:key:1234",
subs: [
{
label: "North Rhine",
value: "state:unique:key:1234",
subs: [
{
label: "Dusseldorf",
value: "city:unique:key:1234",
}
]
},
{
label: "Berlin",
value: "state:unique:key:1234",
}
]
}
,
{
"label": "India",
"value": "country:unique:key:1234"
}
]
Basically, it is a three dimensional array with first level being the Countrie, second States and third Cities. I have tried the following code:
let tempCountries = [];
worldMap.map((world) => {
if (world.parentId == null && world.type == "Country") {
tempCountries.push({label: world.name, value: world.value, id: world.id});
}
});
console.log("=== countries ===", tempCountries);
tempCountries.map((tempCountry) => {
const states = worldMap.find((x) => x.parentId == tempCountry.id);
console.log("=== states ===", states);
if (states !== undefined) {
}
});
In the first loop I got all the values for the countries. Next I am trying to append states and cities to the original countries, I got from the first loop. But I am not able to do so. The code should be verbose with minimum number of loops. Could anyone please help achieve this ?
Thanks

You could take a single loop and store all relations between child/parents and parents/childs.
const
data = [{ name: "Germany", parentId: null, type: "Country", value: "country:unique:key:1234", id: "1" }, { name: "North Rhine", parentId: "1", type: "State", value: "state:unique:key:1234", id: "2" }, { name: "Berlin", parentId: "1", type: "State", value: "state:unique:key:1234", id: "3" }, { name: "Dusseldorf", parentId: "2", type: "city", value: "city:unique:key:1234", id: "4" }, { name: "India", parentId: null, type: "Country", value: "country:unique:key:1234", id: "5" }],
tree = ((data, root) => {
var t = {};
data.forEach(({ id, parentId, name: label, value }) => {
Object.assign(t[id] = t[id] || {}, { label, value });
t[parentId] = t[parentId] || {};
(t[parentId].subs = t[parentId].subs || []).push(t[id]);
});
return t[root].subs;
})(data, null);
console.log(tree);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Related

Update only after all the checks are passed

I want to update array of object only after all the checks are passed. I have array of object representing all the articles and other array of object all the available stock.
I want to check the if all the articles are in stock then only I want to update the stock array. Here is my code:
const articles = [{
"id": "1",
"quantity": "4"
}, {
"id": "2",
"quantity": "8"
}, {
"id": "4",
"quantity": "1"
}];
let stock = [
{
"id": "1",
"stock": "6"
},
{
"id": "2",
"stock": "6"
},
{
"id": "3",
"stock": "2"
},
{
"id": "4",
"stock": "2"
}
];
articles.map(article => {
stock.map(item => {
if(item.id === article.id){
if(article.quantity <= item.stock){
item.stock = item.stock - article.quantity;
} else {
console.log('error');
throw error;
}
}
});
});
Problem with this solution is that it updates stock for id = 1 even though id = 2 is not enough. I am trying to check if all the articles are in stock are in enough quantity and update(minus) them in stock array. So in this case code will update stock array like this:
stock = [
{
"id": "1",
"stock": "2"
},
{
"id": "2",
"stock": "6"
},
{
"id": "3",
"stock": "2"
},
{
"id": "4",
"stock": "2"
}
];
Can someone suggest how can I fix this?
You can use Array.prototype.find(). Note: The snippet assumes that all articles have an "id" property, it doesn't check for "art_id".
const articles = [{
"id": "1",
"quantity": "4"
}, {
"id": "2",
"quantity": "8"
}, {
"id": "4",
"quantity": "1"
}];
let stock = [{
"id": "1",
"stock": "6"
},
{
"id": "2",
"stock": "6"
},
{
"id": "3",
"stock": "2"
},
{
"id": "4",
"stock": "2"
}
];
// Use Array.prototype.some() to check for items that don't have enough stock
const haveEnough = !articles.some(article =>
// Turns "1" into 1
parseInt(
// Find the stock with the same id as the article
stock.find(stock => stock.id === article.id).stock
) <
parseInt(article.quantity))
console.log(haveEnough)
You can then update the stock in
if (haveEnough) {
// Do something
}
I am assuming that the art_id key in the articles array should be id.
Unfortunately you can't do it all in one loop and you will instead have to loop through all the articles first to find out if their stock is enough and then loop though them again to change the existing stock:
const articles = [
{
id: '1',
quantity: '4',
},
{
id: '2',
quantity: '5',
},
{
id: '4',
quantity: '1',
},
];
let stock = [
{
id: '1',
stock: '6',
},
{
id: '2',
stock: '6',
},
{
id: '3',
stock: '2',
},
{
id: '4',
stock: '2',
},
];
// Are there any articles that do not have enough stock
const outOfStockArticles = articles.find((article) => {
const articleStock = stock.find((stock) => stock.id === article.id);
return Number.parseInt(article.quantity) > Number.parseInt(articleStock.stock);
});
// If there are no out of stock articles - change existing stock values
if (!outOfStockArticles) {
articles.forEach((article) => {
const articleStock = stock.find((stock) => stock.id === article.id);
articleStock.stock = Number.parseInt(articleStock.stock) - Number.parseInt(article.quantity);
});
}
There is an inconsistency in your articles array, I suppose that every articles has an "art_id", and not some an "id" and some an "art_id".
You can simply find your article using the Array.prototype.find function, and then by the isAvailable function check that an article is present in the right quantity in the stock list.
Now you can use the Array.prototype.every function that do exactly what you want! It will return true only if every element of the array satisfy the condition, in our case the isAvailable function.
Here a simple fiddle:
const articles = [{
"art_id": "1",
"quantity": "4"
}, {
"art_id": "2",
"quantity": "8"
}, {
"art_id": "4",
"quantity": "1"
}];
const stock = [{
"id": "1",
"stock": "6"
},
{
"id": "2",
"stock": "6"
},
{
"id": "3",
"stock": "2"
},
{
"id": "4",
"stock": "2"
}
];
const isAvaiable = (article) => {
return stock.find(element => element.id === article.art_id).stock >= article.quantity;
}
if (articles.every(isAvaiable)) {
console.log("I can update")
} else {
console.log("I cannot update")
}

How to filter from an object by iterating over it in js

I am trying to get the value of "type" from the object by iterating over it. The object looks like this.
{
"team": {
"table": [
{
"cityCode": 123,
"list": {
"players": [
{
"name": "peter",
"school": "x",
"awards": {
"type": "gold"
},
"year": 2019
}
]
}
},
{
"cityCode": 456,
"list": {
"players": [
{
"name": "Dave",
"school": "y",
"awards": {
"type": "silver"
},
"year": 2018
}
]
}
}
]
}
}
I am able to get the type values using this:
const table = team.table;
for (let i = 0; i < table.length; i++) {
const values = {
type: table[i].list.players
.filter((a) => a.awards != null)
.map((a) => a.awards.type)
.join(" "),
};
}
However, I want to use another filter on the "list" to filter non null lists. So how can I achieve that.
You want to check Check if 'list' key exists inside a team.table JSON object
you can check by
if(table[i].hasOwnProperty('list')){
}
code is
const table = team.table;
for (let i = 0; i < table.length; i++) {
if(table[i].hasOwnProperty('list')){
const values = {
type: table[i].list.players
.filter((a) => a.awards != null)
.map((a) => a.awards.type)
.join(" "),
};
}
}
1) You can get all type using flatMap and map as:
obj.team.table.flatMap((o) => o.list.players.map((o) => o.awards.type))
const obj = {
team: {
table: [
{
cityCode: 123,
list: {
players: [
{
name: "peter",
school: "x",
awards: {
type: "gold",
},
year: 2019,
},
],
},
},
{
cityCode: 456,
list: {
players: [
{
name: "Dave",
school: "y",
awards: {
type: "silver",
},
year: 2018,
},
],
},
},
],
},
};
const types = obj.team.table.flatMap((o) => o.list.players.map((o) => o.awards.type));
console.log(types);
2) Using forEach and destructuring as:
const obj = {
team: {
table: [
{
cityCode: 123,
list: {
players: [
{
name: "peter",
school: "x",
awards: {
type: "gold",
},
year: 2019,
},
],
},
},
{
cityCode: 456,
list: {
players: [
{
name: "Dave",
school: "y",
awards: {
type: "silver",
},
year: 2018,
},
],
},
},
],
},
};
const table = obj.team.table;
const types = [];
for (let i = 0; i < table.length; i++) {
const { list: { players } } = table[i]
players.forEach(({ awards: { type }}) => types.push(type))
}
console.log(types);
It will be cleaner to use forEach.
You will need 2 forEach due to your data structure.
But below code will:
check if awards is null
check if awards.type is null
const data = {
"team": {
"table": [
{
"cityCode": 123,
"list": {
"players": [
{
"name": "peter",
"school": "x",
"awards": {
"type": "gold"
},
"year": 2019
}
]
}
},
{
"cityCode": 456,
"list": {
"players": [
{
"name": "Dave",
"school": "y",
"awards": {
"type": "silver"
},
"year": 2018
},
{
"name": "Dave",
"school": "y",
"awards": {
"type": "gold"
},
"year": 2016
}
]
}
},
{
"cityCode": 444,
"list": {
"players": [
{
"name": "James",
"school": "y",
"awards": {
"type": null
},
"year": 2016
}
]
}
},
{
"cityCode": 555,
"list": {
"players": [
{
"name": "Name 101",
"school": "y",
"awards": {
"type": "platinum"
},
"year": 2016
},
{
"name": "Name 102",
"school": "y",
"awards": {
"type": null
},
"year": 2016
},
{
"name": "Name 103",
"school": "y",
"awards": null,
"year": 2016
},
]
}
}
]
}
}
// Expanded your data with more items
const data1 = data.team.table;
let types = []
data1.forEach((item, index) => {
item.list.players.forEach((player) => {
const awards = player.awards;
if (awards !== null && awards.type !== null) {
types = [...types, awards.type];
}
})
})
// Get the list of types
console.log(types);
// Get unique list of types
let unique_types = [...new Set(types)]
console.log(unique_types);

How to group related fields in JSONL?

I am using Shopify's bulk operation mutation in GraphQL to fetch bulk data for products, invoices, transactions etc.
Shopify returns this data as JSONL. Each line is an object and if it is related to another item then it will have a __parentid which can be used to figure out its parent.
For example, the returned data will look something like this:
const data = [
{
id: "1",
__typename: "parent"
},
{
id: "2",
__parentId: "1",
__typename: "child"
},
{
id: "3",
__parentId: "2",
__typename: "grandChild"
},
{
id: "4",
__parentId: "2",
__typename: "grandChild"
}
]
In order to save this in my database, I need to nest each child value within its parent.
So the above would become
[
{
id: "1",
__typename: "parent",
child: [
{
id: "2",
__parentId: "1",
__typename: "child",
grandChild: [
{
id: "3",
__parentId: "2",
__typename: "grandChild"
},
{
id: "4",
__parentId: "2",
__typename: "grandChild"
}
]
}
]
},
]
This is one approach I tried where you can see I am trying to attach the children to the parent object and then once it has been moved, delete the original object.
export const reduceBulkResult = (chunks) => {
chunks.reverse()
chunks.forEach(chunk => {
const parent = chunks.find(node =>{
return node.id === chunk.__parentId
})
if( parent ) {
if( parent[chunk.__typename] ) {
parent[chunk.__typename].push(chunk)
} else {
parent[chunk.__typename] = [chunk]
}
}
})
return chunks;
}
console.log("reduceBulkResult", reduceBulkResult(data))
[
{
"__parentId": "2",
"__typename": "grandChild",
"id": "4"
},
{
"__parentId": "2",
"__typename": "grandChild",
"id": "3"
},
{
"__parentId": "1",
"__typename": "child",
"grandChild": [
{
"__parentId": "2",
"__typename": "grandChild",
"id": "4"
},
{
"__parentId": "2",
"__typename": "grandChild",
"id": "3"
}
],
"id": "2"
},
{
"__typename": "parent",
"child": [
{
"__parentId": "1",
"__typename": "child",
"grandChild": [
{
"__parentId": "2",
"__typename": "grandChild",
"id": "4"
},
{
"__parentId": "2",
"__typename": "grandChild",
"id": "3"
}
],
"id": "2"
}
],
"id": "1"
}
]
As you can see, there is a lof of duplication here and I need to get rid of the original objects some how and just keep the parent objects which have all the nested data.
I feel like I'm missing a trick here. There must be an easier way.
Shopify have some good tips such asReading the JSONL file in reverse makes it easier to group child nodes
I get the parent with filter() and then use recursive in getChildren to get the result.
I cannot find a simple way and you may change codes to make it more simple.
const data = [ { id: "1", __typename: "parent", }, { id: "2", __parentId: "1", __typename: "child", }, { id: "3", __parentId: "2", __typename: "grandChild", }, { id: "4", __parentId: "2", __typename: "grandChild", }, ]; const o = [ { id: "1", __typename: "parent", child: [ { id: "2", __parentId: "1", __typename: "child", grandChild: [ { id: "3", __parentId: "2", __typename: "grandChild", }, { id: "4", __parentId: "2", __typename: "grandChild", }, ], }, ], }, ];
const convert = data => {
const parent = data.filter(el => !el.__parentId);
const getChildren = (data, parentId) => {
let store = {};
for (const obj of data) {
if (obj.__parentId === parentId) {
const children = data.reduce((a, b) => {
if (b.__parentId === obj.id) {
if (a[b.__typename]) {
a[b.__typename].push({ ...b, ...getChildren(data, b.id) });
} else {
a[b.__typename] = [{ ...b, ...getChildren(data, b.id) }];
}
}
return a;
}, {});
store = { ...store, ...obj, ...children };
}
}
return store;
};
return parent.map(el => {
const children = data.reduce((a, b) => {
if (b.__parentId === el.id) {
if (a[b.__typename]) {
a[b.__typename].push({ ...b, ...getChildren(data, el.id) });
} else {
a[b.__typename] = [{ ...b, ...getChildren(data, el.id) }];
}
}
return a;
}, {});
return { ...el, ...children };
});
};
const output = convert(data);
console.log(output);

How to order an array of objects in array of categories in javascript?

I have the following array of objects
{
"nome": "jose",
"categoria": [
{ "id": "1" },
{ "id": "3" },
]
},
{
"nome": "maria",
"categoria": [
{ "id": "2" },
]
},
{
"nome": "pedro",
"categoria": [
{ "id": "1" },
]
}
I have to reorder in another array of categories. Something like this:
{
"id": "1",
"pessoas": [
{
"nome": "jose",
"categoria": [
{ "id": "1" },
{ "id": "3" },
]
},
{
"nome": "pedro",
"categoria": [
{ "id": "1" },
]
},
]
},
{
"id": "2",
"pessoas": [
{
"nome": "maria",
"categoria": [
{ "id": "2" }
]
},
]
},
I have try with the function reduce(), but I couldn't because it is not an object, but a array of objects (categoria)
const group = data.reduce((r, array) => {
r[array.categoria.id] = [...r[array.categoria.id] || [], array];
return r;
}, {});
Someone can help me please?
You could take an object for grouping by id. Inside of reduce, categoria is iterated as well for getting the needed id.
var data = [{ nome: "jose", categoria: [{ id: "1" }, { id: "3" }] }, { nome: "maria", categoria: [{ id: "2" }] }, { nome: "pedro", categoria: [{ id: "1" }] }],
result = Object.values(data.reduce((r, o) => {
o.categoria.forEach(({ id }) => {
if (!r[id]) r[id] = { id, pessoas: [] };
r[id].pessoas.push(o);
});
return r;
}, {}));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

How to make recursively nested array in javascript?

Below is the json I have:
{
"name": "test",
"characteristics": [
{
"name": "A",
"description": "",
"comprisedOf": [
{
"name": "A1",
"description": "",
"comprisedOf": [
{
"name": "A1.1",
"description": "",
"value": "10"
},
{
"name": "A1.2",
"description": "",
"value": "5"
}
]
},
{
"name": "A2",
"description": "",
"value": "100"
},
{
"name": "A3",
"description": "",
"value": "20"
},
{
"name": "A4",
"description": "",
"value": "50"
}
]
},
{
"name": "B",
"description": "",
"value": "10"
}
]
}
Here I have 2 characteristics object of "test" - A and B.These 2 objects may or may not have "comprisedOf" array. For Eg A has"comprisedOf" array whereas B has not. These comprisedOf array further may or may not have comprisedof objects array.
Now i have to make an array out of this which should be like the given below array:-
[
{
"name": "test",
"children": [
{
"name": "A",
"children": [
{
"name":"A1",
"children:: [
{
"name": "A1.1"
},
{
"name": "A1.2"
}
]
},
{
"name": "A2"
},
{
"name": "A3"
},
{
"name": "A4"
}
]
},
{
"name": "B"
}
]
}
]
How this array can be formed recursively out of the first array?
Thanks so much!!
EDIT:- Here's what I have tried:-
var makeChildrenAll = function(dataChar){
dataChar.forEach(function(char){
if(char.comprisedOf) {
makeChildrenAll(char.comprisedOf);
}
childrenData.push({
name: char.name,
description: char.description,
children: childrenData
});
});
};
makeChildrenAll(dataChar);
In order to be recursive you want the function to return and be able to assign that return to current object
Something like
function mapItems(arr){
// return new array
return arr.reduce((a,c)=>{
var newObj={name:c.name};
if(Array.isArray(c.comprisedOf)){
// use returned array of recursive function to assign to `children` property
newObj.children = mapItems(c.comprisedOf)
}
return a.concat(newObj)
},[])
}
console.log(mapItems(data.characteristics))
.as-console-wrapper { max-height: 100%!important;}
<script>
var data ={
"name": "test",
"characteristics": [
{
"name": "A",
"description": "",
"comprisedOf": [
{
"name": "A1",
"description": "",
"comprisedOf": [
{
"name": "A1.1",
"description": "",
"value": "10"
},
{
"name": "A1.2",
"description": "",
"value": "5"
}
]
},
{
"name": "A2",
"description": "",
"value": "100"
},
{
"name": "A3",
"description": "",
"value": "20"
},
{
"name": "A4",
"description": "",
"value": "50"
}
]
},
{
"name": "B",
"description": "",
"value": "10"
}
]
}
</script>
You could take a different start array and use a destructuring for the wanted properties.
function mapItems(array) {
return array.map(({ name, comprisedOf }) =>
Object.assign({ name }, comprisedOf && { children: mapItems(comprisedOf) }));
}
var data = { name: "test", characteristics: [{ name: "A", description: "", comprisedOf: [{ name: "A1", description: "", comprisedOf: [{ name: "A1.1", description: "", value: "10" }, { name: "A1.2", description: "", value: "5" }] }, { name: "A2", description: "", value: "100" }, { name: "A3", description: "", value: "20" }, { name: "A4", description: "", value: "50" }] }, { name: "B", description: "", value: "10" }] };
console.log(mapItems([{ name: data.name, comprisedOf: data.characteristics }]));
.as-console-wrapper { max-height: 100% !important; top: 0; }
ES5
function mapItems(array) {
return array.map(function (o) {
var r = { name: o.name };
if (o.comprisedOf) {
r.children = mapItems(o.comprisedOf);
}
return r;
});
}
var data = { name: "test", characteristics: [{ name: "A", description: "", comprisedOf: [{ name: "A1", description: "", comprisedOf: [{ name: "A1.1", description: "", value: "10" }, { name: "A1.2", description: "", value: "5" }] }, { name: "A2", description: "", value: "100" }, { name: "A3", description: "", value: "20" }, { name: "A4", description: "", value: "50" }] }, { name: "B", description: "", value: "10" }] };
console.log(mapItems([{ name: data.name, comprisedOf: data.characteristics }]));
.as-console-wrapper { max-height: 100% !important; top: 0; }

Categories

Resources