Formatting response in Javascript - javascript

I have a set of data where i need to format and render in HTML.
This is the data :
var data = [{
name: 'john',
age: 20,
department: 'financial',
group: 'groupA'
},
{
name: 'john',
age: 20,
department: 'healthcare',
group: 'groupA'
},
{
name: 'john',
age: 20,
department: 'insurance',
group: 'groupA'
},
{
name: 'john',
age: 20,
department: 'Realestate',
group: 'groupB'
}, {
name: 'Mark',
age: 20,
department: 'financial',
group: 'groupA'
},
{
name: 'Mark',
age: 21,
department: 'insurance',
group: 'groupA'
},
{
name: 'Mark',
age: 21,
department: 'financial',
group: 'groupB'
}
];
Here i have multiple users where he belongs to different groups and department.I want to format in such a way the if he belongs to same group then get the department which he belongs to in array and for other department show that as a new object.
The response should look like this:
var data_formatted = [
[{
name: 'john',
age: 20,
department: ['financial', 'healthcare', 'insurance'],
group: 'groupA'
},
{
name: 'john',
age: 20,
department: 'Realestate',
group: 'groupB'
}
],
[{
name: 'Mark',
age: 20,
department: ['financial', 'insurance'],
group: 'groupA'
},
{
name: 'Mark',
age: 21,
department: 'financial',
group: 'groupB'
}
]
];
Any suggestions Please!


I think this may help you.
var data = [{
name: 'john',
age: 20,
department: 'financial',
group: 'groupA'
},
{
name: 'john',
age: 20,
department: 'healthcare',
group: 'groupA'
},
{
name: 'john',
age: 20,
department: 'insurance',
group: 'groupA'
},
{
name: 'john',
age: 20,
department: 'Realestate',
group: 'groupB'
}, {
name: 'Mark',
age: 20,
department: 'financial',
group: 'groupA'
},
{
name: 'Mark',
age: 21,
department: 'insurance',
group: 'groupA'
},
{
name: 'Mark',
age: 21,
department: 'financial',
group: 'groupB'
}
];
var data_formatted = [];
var byname = _.groupBy(data, function(element){return element.name});
_.forEach(byname, function(element){
var bygroup = _.groupBy(element, function(element){return element.group});
_.forEach(bygroup, function(element, key, groups){
var departments = _.map(element, 'department');
element[0]['department'] = departments;
groups[key] = element[0];
})
data_formatted.push(_.values(bygroup));
})
console.log(data_formatted);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

Related

how to add an element to the object containing the elements of the object

How can i get a part of the object and put it in a new element in that object
I have an original Array like this
[
{
stt:1,
code: 24,
name: 'n',
age: 27,
address: 'somewhere',
},
{
stt:2,
code: 82,
name: 'jo',
age: 23,
address: 'tree',
},
{
stt:3,
code: 2,
name: 'con',
age: 23,
address: 'somewhere',
},
]
array that i expected to be a result :
[
{
stt:1,
code: 24,
name: 'n',
employee: {
age: 27,
address: 'somewhere',
}
},
{
stt:2,
code: 82,
name: 'jo',
employee: {
age: 23,
address: 'tree',
}
},
{
stt:3,
code: 2,
name: 'con',
employee: {
age: 23,
address: 'somewhere',
}
},
]
i tried to get first 3 element of object but dont know how to do next

you can use Array.map for that
like this
const transform = data =>data.map(
({age, address, ...rest}) => ({...rest, employee: {age, address}})
)
const data = [
{
stt:1,
code: 24,
name: 'n',
age: 27,
address: 'somewhere',
},
{
stt:2,
code: 82,
name: 'jo',
age: 23,
address: 'tree',
},
{
stt:3,
code: 2,
name: 'con',
age: 23,
address: 'somewhere',
},
]
console.log(transform(data))

How to sort an array with special conditions

I just want to return an array containing the first and second objects based on the "point" property of an object
and I have a condition below, When the condition is satisfied it will swap places.
Default:
ENGLISH[0]
ENGLISH[1]
MATH[0]
MATH[1]
HISTORY[0]
HISTORY[1]
...
if(ENGLISH[0].POINT/ENGLISH[1].POINT > MATH[0].POINT/MATH[1].POINT)
MATH[0]
MATH[1]
ENGLISH[0]
ENGLISH[1]
HISTORY[0]
HISTORY[1]
...
Given the following object:
const arr = [
{ name: "John", age: 32, group: "Math", point: 70 },
{ name: "David", age: 23, group: "Math", point: 20 },
{ name: "Justin", age: 28, group: "Math", point: 20 },
{ name: "Neymar", age: 30, group: "Math", point: 50 },
{ name: "Arnauld", age: 35, group: "History", point: 40 },
{ name: "Ivan", age: 18, group: "History", point: 50 },
{ name: "Nekko", age: 13, group: "History", point: 80 },
{ name: "Lena", age: 25, group: "English", point: 90 },
{ name: "Test", age: 45, group: "English", point: 30 },
{ name: "Ann", age: 19, group: "English", point: 38 }
]
the result I want is
const result = [
{ name: "Lena", age: 25, group: "English", point: 90 },
{ name: "Test", age: 45, group: "English", point: 30 },
{ name: "John", age: 32, group: "Math", point: 70 },
{ name: "David", age: 23, group: "Math", point: 20 },
{ name: "Arnauld", age: 35, group: "History", point: 40 },
{ name: "Ivan", age: 18, group: "History", point: 50 },
{ name: "Ann", age: 19, group: "English", point: 38 },
{ name: "Justin", age: 28, group: "Math", point: 20 },
{ name: "Neymar", age: 30, group: "Math", point: 50 },
{ name: "Nekko", age: 13, group: "History", point: 80 }
]

You could group the data with an object for the indices and an array of references.
const
order = { English: 0, Math: 1, History: 2 },
data = [{ name: "John", age: 32, group: "Math", point: 70 }, { name: "David", age: 23, group: "Math", point: 20 }, { name: "Justin", age: 28, group: "Math", point: 20 }, { name: "Neymar", age: 30, group: "Math", point: 50 }, { name: "Arnauld", age: 35, group: "History", point: 40 }, { name: "Ivan", age: 18, group: "History", point: 50 }, { name: "Nekko", age: 13, group: "History", point: 80 }, { name: "Lena", age: 25, group: "English", point: 90 }, { name: "Test", age: 45, group: "English", point: 30 }, { name: "Ann", age: 19, group: "English", point: 38 }],
references = [0, 0, 0],
result = data
.reduce((r, o) => {
const i = order[o.group];
if (r[references[i]][i].length === 2) {
references[i]++;
r[references[i]] ??= []
r[references[i]][i] = [];
}
r[references[i]][i].push(o);
return r;
}, [[[], [], []]])
.flat(Infinity);
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

In case reactjs Run time environment has been tested.
import sortBy from 'lodash/sortBy';
let testData = [
{ name: 'Lena', age: 25, group: 'English', point: 90 },
{ name: 'Test', age: 45, group: 'English', point: 30 },
{ name: 'John', age: 32, group: 'Math', point: 70 },
{ name: 'David', age: 23, group: 'Math', point: 20 },
{ name: 'Arnauld', age: 35, group: 'History', point: 40 },
{ name: 'Ivan', age: 18, group: 'History', point: 50 },
{ name: 'Ann', age: 19, group: 'English', point: 38 },
{ name: 'Justin', age: 28, group: 'Math', point: 20 },
{ name: 'Neymar', age: 30, group: 'Math', point: 50 },
{ name: 'Nekko', age: 13, group: 'History', point: 80 }
];
let sortedDataByName = sortBy(result, 'name');
let sortedDataByAge = sortBy(result, 'age');
let sortedDataByGroup = sortBy(result, 'group');
let sortedDataByPoints = sortBy(result, 'point');

Javascript array gets sorted before sort statement [duplicate]

This question already has answers here:
Is Chrome’s JavaScript console lazy about evaluating objects?
(7 answers)
Closed 9 months ago.
Edit: This seems related to the way the chrome console handles object evaluation as noted by
jsN00b
original here
I'm sorting an array by name and then by age, logging the array three times:
Once right after initialization,
second and third time is after sorting the array by name and then age respectively.
The first console.log() call however, prints the array in its sorted state, but what I expected to have is the array in it's unsorted state.
Not sure if this is related to the way JavaScript handles array in memory or is is it a bug?
Code:
function byField(field) {
return (objA, objB) => (objA[field] > objB[field] ? 1 : -1);
}
let users = [
{ name: "John", age: 20, surname: "Johnson" },
{ name: "Pete", age: 18, surname: "Peterson" },
{ name: "Ann", age: 19, surname: "Hathaway" },
];
console.log(users);
users.sort(byField("name"));
console.log(users);
users.sort(byField("age"));
console.log(users);
.as-console-wrapper { max-height: 100% !important; top: 0 }
Expected output:
//unsorted
[
{ name: "John", age: 20, surname: "Johnson" },
{ name: "Pete", age: 18, surname: "Peterson" },
{ name: "Ann", age: 19, surname: "Hathaway" },
];
//by name
[
{ name: "Ann", age: 19, surname: "Hathaway" },
{ name: "John", age: 20, surname: "Johnson" },
{ name: "Pete", age: 18, surname: "Peterson" },
];
//by age
[
{ name: "Pete", age: 18, surname: "Peterson" },
{ name: "Ann", age: 19, surname: "Hathaway" },
{ name: "John", age: 20, surname: "Johnson" },
];
Actual Output:
//unsorted
[
{ name: "Pete", age: 18, surname: "Peterson" },
{ name: "Ann", age: 19, surname: "Hathaway" },
{ name: "John", age: 20, surname: "Johnson" },
];
//by name
[
{ name: "Pete", age: 18, surname: "Peterson" },
{ name: "Ann", age: 19, surname: "Hathaway" },
{ name: "John", age: 20, surname: "Johnson" },
];
//by age
[
{ name: "Pete", age: 18, surname: "Peterson" },
{ name: "Ann", age: 19, surname: "Hathaway" },
{ name: "John", age: 20, surname: "Johnson" },
];

Method Array.prototype.sort does mutate your initial array. For fix this problem you need to create copy of array and then sort this copy.
It is like follow example:
[...users].sort(byField("name"));

A simple methodology to merge Array of the nested object into an array of the same object

I'm looking for a simple methodology to merge the Array of the nested object into an array of the same object
Input:
const data=[
{ id: 123, name: "dave", age: 23 , address:{city:"chennai", zipcode:600001}},
{ id: 456, name: "chris", age: 23, address:{city:"cbe", zipcode:600002} },
{ id: 789, name: "bob", age: 23, address:{city:"tiruppur", zipcode:600003}},
{ id: 101, name: "tom", age: 23, address:{city:"erode", zipcode:600004} },
{ id: 102, name: "tim", age: 23, address:{city:"selam", zipcode:600005} }
]
Needed Output:
{ id: 123, name: "dave", age: 23, city:"chennai", zipcode:600001},
{ id: 456, name: "chris", age: 23, city:"cbe", zipcode:600002},
{ id: 789, name: "bob", age: 23, city:"tiruppur", zipcode:600003},
{ id: 101, name: "tom", age: 23, city:"erode", zipcode:600004},
{ id: 102, name: "tim", age: 23, city:"selam", zipcode:600005}
]

Use a combination of destructuring and spread syntax:
const data=[{ id: 123, name: "dave", age: 23 , address:{city:"chennai", zipcode:600001}},{ id: 456, name: "chris", age: 23, address:{city:"cbe", zipcode:600002} },{ id: 789, name: "bob", age: 23, address:{city:"tiruppur", zipcode:600003}},{ id: 101, name: "tom", age: 23, address:{city:"erode", zipcode:600004} },{ id: 102, name: "tim", age: 23, address:{city:"selam", zipcode:600005} }];
const result = data.map(({address, ...rest}) => ({...rest, ...address}));
console.log(result);

You can use Object.entries to extract each property and its value in the address property and assign it to the parent object, then delete the address property.
const data=[{id:123,name:"dave",age:23,address:{city:"chennai",zipcode:600001}},{id:456,name:"chris",age:23,address:{city:"cbe",zipcode:600002}},{id:789,name:"bob",age:23,address:{city:"tiruppur",zipcode:600003}},{id:101,name:"tom",age:23,address:{city:"erode",zipcode:600004}},{id:102,name:"tim",age:23,address:{city:"selam",zipcode:600005}}];
const result = data.map(e => (Object.entries(e.address).forEach(f => e[f[0]] = f[1]), delete e.address, e))
console.log(result)

let data = [
{ id: 123, name: "dave", age: 23, address: { city: "chennai", zipcode: 600001 } },
{ id: 456, name: "chris", age: 23, address: { city: "cbe", zipcode: 600002 } },
{ id: 789, name: "bob", age: 23, address: { city: "tiruppur", zipcode: 600003 } },
{ id: 101, name: "tom", age: 23, address: { city: "erode", zipcode: 600004 } },
{ id: 102, name: "tim", age: 23, address: { city: "selam", zipcode: 600005 } }
]
data = data.map((node) => ({ id: node.id, name: node.name, age: node.age, city: node.address.city, zipcode: node.address.zipcode }))
console.log(data)

const data=[
{ id: 123, name: "dave", age: 23 , address:{city:"chennai", zipcode:600001}},
{ id: 456, name: "chris", age: 23, address:{city:"cbe", zipcode:600002} },
{ id: 789, name: "bob", age: 23, address:{city:"tiruppur", zipcode:600003}},
{ id: 101, name: "tom", age: 23, address:{city:"erode", zipcode:600004} },
{ id: 102, name: "tim", age: 23, address:{city:"selam", zipcode:600005} }
];
const result = data.map(item => ({id: item.id, name: item.name, age: item.age, ...item.address}));
console.log(result);

Javascript sort obj by compound key

I have an object so defined:
{
_id: "5d406a171ed43384972f04b5",
index: 0,
age: 28,
eyeColor: "brown",
name: {
first: "Myra",
last: "Navarro"
},
company: "SUSTENZA",
email: "myra.navarro#sustenza.net"
}
I would need to be able to do the search on all keys, even in compound keys like name.
For example I have a search string name.first and the like, it could be even deeper and compound objects.
I managed to do this, but on name.first for example I am failing to get it to work.
Can you give me a hand?
let datatable = [
{
_id: "5d406a171ed43384972f04b5",
index: 0,
age: 28,
eyeColor: "brown",
name: {
first: "Myra",
last: "Navarro"
},
company: "SUSTENZA",
email: "myra.navarro#sustenza.net"
},
{
_id: "5d406a170db0f4b04d9a9acf",
index: 1,
age: 23,
eyeColor: "blue",
name: {
first: "Harriett",
last: "Tanner"
},
company: "VALPREAL",
email: "harriett.tanner#valpreal.com"
},
{
_id: "5d406a17e95da8ff80a759c5",
index: 2,
age: 39,
eyeColor: "blue",
name: {
first: "Vega",
last: "Hanson"
},
company: "BEDLAM",
email: "vega.hanson#bedlam.tv"
},
{
_id: "5d406a175505da190e6875ec",
index: 3,
age: 31,
eyeColor: "blue",
name: {
first: "Rosemary",
last: "Fields"
},
company: "QUAILCOM",
email: "rosemary.fields#quailcom.me"
},
{
_id: "5d406a17ea96044c027f4e50",
index: 4,
age: 27,
eyeColor: "brown",
name: {
first: "Dale",
last: "Wilkinson"
},
company: "QIAO",
email: "dale.wilkinson#qiao.org"
},
{
_id: "5d406a17c5fff1ff6653a555",
index: 5,
age: 25,
eyeColor: "blue",
name: {
first: "Beatrice",
last: "Contreras"
},
company: "ZENOLUX",
email: "beatrice.contreras#zenolux.us"
},
{
_id: "5d406a17a199efcba25e1f26",
index: 6,
age: 34,
eyeColor: "blue",
name: {
first: "Hancock",
last: "Wynn"
},
company: "PLASMOS",
email: "hancock.wynn#plasmos.co.uk"
},
{
_id: "5d406a17019a2a4544a4f134",
index: 7,
age: 40,
eyeColor: "blue",
name: {
first: "Brown",
last: "Stanton"
},
company: "SNACKTION",
email: "brown.stanton#snacktion.name"
},
{
_id: "5d406a17e516dd71af8210d4",
index: 8,
age: 39,
eyeColor: "blue",
name: {
first: "Barnes",
last: "Dunn"
},
company: "PORTALINE",
email: "barnes.dunn#portaline.ca"
},
{
_id: "5d406a17516936a025b73c33",
index: 9,
age: 34,
eyeColor: "green",
name: {
first: "Blanche",
last: "Cherry"
},
company: "ISOSWITCH",
email: "blanche.cherry#isoswitch.io"
},
{
_id: "5d406a17527a4d2c6a7897dd",
index: 10,
age: 33,
eyeColor: "blue",
name: {
first: "Gilliam",
last: "Farley"
},
company: "AMTAS",
email: "gilliam.farley#amtas.biz"
},
{
_id: "5d406a175ff11478c416c30b",
index: 11,
age: 26,
eyeColor: "brown",
name: {
first: "Laura",
last: "Short"
},
company: "FISHLAND",
email: "laura.short#fishland.info"
},
{
_id: "5d406a1738181b471847339a",
index: 12,
age: 20,
eyeColor: "brown",
name: {
first: "Moreno",
last: "Barber"
},
company: "KEENGEN",
email: "moreno.barber#keengen.net"
},
{
_id: "5d406a17a6bcae6fe3ad1735",
index: 13,
age: 30,
eyeColor: "brown",
name: {
first: "Fischer",
last: "French"
},
company: "INCUBUS",
email: "fischer.french#incubus.com"
},
{
_id: "5d406a17600ca53e8f63f263",
index: 14,
age: 30,
eyeColor: "brown",
name: {
first: "Donaldson",
last: "Carr"
},
company: "SUNCLIPSE",
email: "donaldson.carr#sunclipse.tv"
},
{
_id: "5d406a17530655789a27174f",
index: 15,
age: 35,
eyeColor: "green",
name: {
first: "Sophia",
last: "Payne"
},
company: "PRISMATIC",
email: "sophia.payne#prismatic.me"
},
{
_id: "5d406a175dbc687b4c7669d8",
index: 16,
age: 34,
eyeColor: "green",
name: {
first: "Simone",
last: "Pollard"
},
company: "DIGIGEN",
email: "simone.pollard#digigen.org"
},
{
_id: "5d406a179f35ed326a6a5567",
index: 17,
age: 28,
eyeColor: "green",
name: {
first: "Yvette",
last: "Daugherty"
},
company: "CHILLIUM",
email: "yvette.daugherty#chillium.us"
}
];
const sortAsc = true;
const sortField = "name.first";//index,eyeColor
var result = datatable.sort((a, b) => {
let [x, z] = sortAsc ? [a, b] : [b, a];
//console.log(x[sortField], z[sortField], x[sortField] > z[sortField] ? 1 : -1);
return x[sortField] > z[sortField] ? 1 : -1;
});
console.log(result);
Edit:
It seems to work like this, but I would like to write it in a more compact form and possibly reduce the computation time.
Do you think it is possible?
var result = datatable.sort((a, b) => {
let [x, z] = sortAsc ? [a, b] : [b, a];
const arraySplit = sortField.split('.');
var vX = arraySplit.reduce((a, b) => a[b], x);
var vZ = arraySplit.reduce((a, b) => a[b], z);
return vX > vZ ? 1 : -1;
});

First issue is that javascript doesn't automatically access children using dots.
If you want to implement that, here are some solutions:
Access object child properties using a dot notation string
Next, once you have the value you want to compare with.
You need to use a special string compare function if the value is a string (use typeof to check). Or use valA - valB so that you get 1, 0, and -1 as the return values to sort with.

I hope this is what you need. The child function makes what you need. You have the explanation in the comments.
let datatable = [
{
_id: "5d406a171ed43384972f04b5",
index: 0,
age: 28,
eyeColor: "brown",
name: {
first: "Myra",
last: "Navarro"
},
company: "SUSTENZA",
email: "myra.navarro#sustenza.net"
},
{
_id: "5d406a170db0f4b04d9a9acf",
index: 1,
age: 23,
eyeColor: "blue",
name: {
first: "Harriett",
last: "Tanner"
},
company: "VALPREAL",
email: "harriett.tanner#valpreal.com"
},
{
_id: "5d406a17e95da8ff80a759c5",
index: 2,
age: 39,
eyeColor: "blue",
name: {
first: "Vega",
last: "Hanson"
},
company: "BEDLAM",
email: "vega.hanson#bedlam.tv"
},
{
_id: "5d406a175505da190e6875ec",
index: 3,
age: 31,
eyeColor: "blue",
name: {
first: "Rosemary",
last: "Fields"
},
company: "QUAILCOM",
email: "rosemary.fields#quailcom.me"
},
{
_id: "5d406a17ea96044c027f4e50",
index: 4,
age: 27,
eyeColor: "brown",
name: {
first: "Dale",
last: "Wilkinson"
},
company: "QIAO",
email: "dale.wilkinson#qiao.org"
},
{
_id: "5d406a17c5fff1ff6653a555",
index: 5,
age: 25,
eyeColor: "blue",
name: {
first: "Beatrice",
last: "Contreras"
},
company: "ZENOLUX",
email: "beatrice.contreras#zenolux.us"
},
{
_id: "5d406a17a199efcba25e1f26",
index: 6,
age: 34,
eyeColor: "blue",
name: {
first: "Hancock",
last: "Wynn"
},
company: "PLASMOS",
email: "hancock.wynn#plasmos.co.uk"
},
{
_id: "5d406a17019a2a4544a4f134",
index: 7,
age: 40,
eyeColor: "blue",
name: {
first: "Brown",
last: "Stanton"
},
company: "SNACKTION",
email: "brown.stanton#snacktion.name"
},
{
_id: "5d406a17e516dd71af8210d4",
index: 8,
age: 39,
eyeColor: "blue",
name: {
first: "Barnes",
last: "Dunn"
},
company: "PORTALINE",
email: "barnes.dunn#portaline.ca"
},
{
_id: "5d406a17516936a025b73c33",
index: 9,
age: 34,
eyeColor: "green",
name: {
first: "Blanche",
last: "Cherry"
},
company: "ISOSWITCH",
email: "blanche.cherry#isoswitch.io"
},
{
_id: "5d406a17527a4d2c6a7897dd",
index: 10,
age: 33,
eyeColor: "blue",
name: {
first: "Gilliam",
last: "Farley"
},
company: "AMTAS",
email: "gilliam.farley#amtas.biz"
},
{
_id: "5d406a175ff11478c416c30b",
index: 11,
age: 26,
eyeColor: "brown",
name: {
first: "Laura",
last: "Short"
},
company: "FISHLAND",
email: "laura.short#fishland.info"
},
{
_id: "5d406a1738181b471847339a",
index: 12,
age: 20,
eyeColor: "brown",
name: {
first: "Moreno",
last: "Barber"
},
company: "KEENGEN",
email: "moreno.barber#keengen.net"
},
{
_id: "5d406a17a6bcae6fe3ad1735",
index: 13,
age: 30,
eyeColor: "brown",
name: {
first: "Fischer",
last: "French"
},
company: "INCUBUS",
email: "fischer.french#incubus.com"
},
{
_id: "5d406a17600ca53e8f63f263",
index: 14,
age: 30,
eyeColor: "brown",
name: {
first: "Donaldson",
last: "Carr"
},
company: "SUNCLIPSE",
email: "donaldson.carr#sunclipse.tv"
},
{
_id: "5d406a17530655789a27174f",
index: 15,
age: 35,
eyeColor: "green",
name: {
first: "Sophia",
last: "Payne"
},
company: "PRISMATIC",
email: "sophia.payne#prismatic.me"
},
{
_id: "5d406a175dbc687b4c7669d8",
index: 16,
age: 34,
eyeColor: "green",
name: {
first: "Simone",
last: "Pollard"
},
company: "DIGIGEN",
email: "simone.pollard#digigen.org"
},
{
_id: "5d406a179f35ed326a6a5567",
index: 17,
age: 28,
eyeColor: "green",
name: {
first: "Yvette",
last: "Daugherty"
},
company: "CHILLIUM",
email: "yvette.daugherty#chillium.us"
}
];
const sortAsc = true;
const sortField = "name.first";//index,eyeColor
var result = datatable.sort((a, b) => {
let [x, z] = sortAsc ? [a, b] : [b, a];
//console.log(x[sortField], z[sortField], x[sortField] > z[sortField] ? 1 : -1);
//return x[sortField] > z[sortField] ? 1 : -1;
return child(x, sortField) > child(z, sortField) ? 1: -1;
});
console.log(result);
function child(obj, str){
//take dot-separated chain of properties' names and split them into an array
const props = str.split('.');
let child = obj;
//looop through all properties' names and get the access to the following [Object] children sequentially
props.forEach((prop)=> child = child[prop]);
return child;
}

Option 1:
const objRoute = sortField.split(".");
const getValue = obj => objRoute.reduce((v, c) => v[c], obj);
const result = datatable.sort((a, b) =>
sortAsc
? getValue(a).localeCompare() - getValue(b).localeCompare()
: getValue(b).localeCompare() - getValue(a).localeCompare()
);
Option 2:
Use eval, eval() evaluates the expression.
It is recommended to use this function with caution:
const result = datatable.sort((a, b, i) => eval(`a.${sortField}`) - eval(`b.${sortField}`));

Categories