Renaming object properties in an array of objects - javascript

I have the following structure:
const data = {
invoices: [
{
Date: "2018-12-18T00:00:00.000Z",
InvoiceNumber: "59"
},
{
Date: "2018-12-18T00:00:00.000Z",
InvoiceNumber: "59"
}
]
};
I am wanting to re-name all instances of InvoiceNumber to CreditNoteNumber to give me the following:
const data = {
invoices: [
{
Date: "2018-12-18T00:00:00.000Z",
CreditNoteNumber: "59"
},
{
Date: "2018-12-18T00:00:00.000Z",
CreditNoteNumber: "59"
}
]
};
I have tried various things like the following for example:
var changed = data.invoices.map(function(item) {
return {
...data.invoices,
CreditNoteNumber: item.InvoiceNumber
};
});
However the spread pushes CreditNoteNumber outside the object.

Just use destructure and rename
const data = {
invoices: [
{
Date: "2018-12-18T00:00:00.000Z",
InvoiceNumber: "59"
},
{
Date: "2018-12-18T00:00:00.000Z",
InvoiceNumber: "59"
}
]
};
var changed = data.invoices.map(
({ Date, InvoiceNumber: CreditNoteNumber }) => ({ Date, CreditNoteNumber })
);
console.log(changed);

There is no such operation as "renaming" a property in JavaScript.
You will need to delete the property you no longer wish to keep:
const data = {
invoices: [
{
Date: "2018-12-18T00:00:00.000Z",
InvoiceNumber: "59"
},
{
Date: "2018-12-18T00:00:00.000Z",
InvoiceNumber: "59"
}
]
};
const changed = data.invoices.map(item => {
const obj = {
...item,
CreditNoteNumber: item.InvoiceNumber
};
delete obj.InvoiceNumber
return obj
});
console.log(changed)

var changed = data.invoices.map(function(item) {
return {
Date: item.Date,
CreditNoteNumber: item.InvoiceNumber
};
});

You can use the function map along with the function Object.assign as follow:
The following approach doesn't mutate the original object
const data = {invoices: [{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"},{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"}]},
result = data.invoices.map(({InvoiceNumber: CreditNoteNumber, ...items}) => Object.assign({}, items, {CreditNoteNumber}));
console.log(result);
If you want to mutate the original object, you can use a forEach instead:
const data = {invoices: [{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"},{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"}]};
data.invoices.forEach((item) => {
item.CreditNoteNumber = item.InvoiceNumber;
delete item.InvoiceNumber;
});
console.log(data);

the best option is to create a new object with the property item.CreditNoteNumber
and use a for each loop to iterate and reassign the values to the new object.
once the new object is created, assign the new object to the original object
data.invoices.
const data = {invoices: [{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"},{Date: "2018-12-18T00:00:00.000Z",InvoiceNumber: "59"}]};
var newInvoices = [];
data.invoices.forEach((item) => {
let invoice = {};
invoice.Date = item.Date;
invoice.CreditNoteNumber = item.InvoiceNumber;
newInvoice.push(invoice);
});
data.invoices = newInvoices;
console.log(data.invoices);

Related

Javascript - Mix two arrays of objects ordering by date and without repetitions

I have two lists:
let originalDocs = [
{
id: "sara",
date: new Date("01/01/2022")
},
{
id: "vic",
date: new Date("10/26/2020")
}
];
let newDocs = [
{
id: "vic",
date: new Date("01/02/2022")
},
{
id: "raul",
date: new Date("05/05/2021")
}
];
I need to mix both lists, ordering by date (in descending order) and without repetitions.
In order to do that, I have decided to:
Delete the set of elements of the original array that are included in the new array (I mean, deleting the intersection) without modifying the original array.
Mix the resulted array ordering by date.
This is my current code:
function removeIntersection(originalDocs, newDocs) {
return originalDocs.filter((originalDoc) => {
const index = newDocs.findIndex(
(newDoc) => newDoc.id === originalDoc.id
);
return index === -1;
});
}
function mixInOrder(originalDocs, newDocs) {
return [...newDocs, ...originalDocs]
.sort((a, b) => b.date - a.date);
}
//
// MAIN
//
let originalDocs = [
{
id: "sara",
date: new Date("01/01/2022")
},
{
id: "vic",
date: new Date("10/26/2020")
}
];
let newDocs = [
{
id: "vic",
date: new Date("01/02/2022")
},
{
id: "raul",
date: new Date("05/05/2021")
}
];
const result = mixInOrder(
removeIntersection(originalDocs, newDocs),
newDocs
);
console.log(result);
How can I do the same in a more optimal way, I mean, without the need of merging (using the spread syntax) the list before sorting it, or deleting the intersection in O(1).
I mean, is it possible to just insert in order avoiding the copy?
You can easily achieve the result using Set and reduce as:
Create a new array by adding the originalDocs first and then newDocs afterwards.
Use reduce to loop over the newly created array and then filter the objects.
You can use Set to check for existence of a key in efficient way
After filtering, you can then sort it accordingly.
let originalDocs = [
{
id: 'sara',
date: new Date('01/01/2022'),
},
{
id: 'vic',
date: new Date('10/26/2020'),
},
];
let newDocs = [
{
id: 'vic',
date: new Date('01/02/2022'),
},
{
id: 'raul',
date: new Date('05/05/2021'),
},
];
const set = new Set();
const result = [...originalDocs, ...newDocs].reduce((acc, curr) => {
if (!set.has(curr.id)) {
acc.push(curr);
set.add(curr.id);
}
return acc;
}, [])
.sort((a, b) => b.date - a.date);
console.log(result);
Here's how to do this using a JS Map, where you use the id as identifier:
let originalDocs = [
{
id: "sara",
date: new Date("01/01/2022")
},
{
id: "vic",
date: new Date("10/26/2020")
}
];
let newDocs = [
{
id: "vic",
date: new Date("01/02/2022")
},
{
id: "raul",
date: new Date("05/05/2021")
}
];
const map = new Map(originalDocs.map(el => [el.id, el]));
newDocs.forEach(el => map.set(el.id, el));
const sorted = [...map.values()].sort((a, b) => a.date - b.date);
console.log(sorted)
This overrides any originalDocs entry with a newDocs entry if they have the same id.

JavaScript modify Array of Objects and alter contained data

I am having difficulties formatting some data. Currently, I receive data in the following structure.
[
{
"q1":"5",
"q2":[
"13",
"12",
],
"q3":"test",
}
]
I essentially need to modify this or even create a new object, that takes the following structure.
[
{
id: 1, //q1
answers: [
{
answer: '5',
},
],
},
{
id: 2, //q2
answers: [
{
answer: '13',
},
{
answer: '12',
},
],
},
{
id: 3, //q3
answers: [
{
answer: 'test',
},
],
},
];
So the id in the above would be obtained by remove the q and getting the number in the first data object. It would then have an answers array that would have an object for each answer.
I have been attempting this but have gotten lost. I don't know if I should use loops, mapping, filters etc. To be honest, the furthest I have got so far is obtaining the keys
var modified = data.map(function(item) {
return Object.keys(item)
})
I have created a JSFiddle where I have been attempting to do this.
Is there any way I can achieve the data I am after?
Many thanks
Please use map function.
const data = {
"q1":"5",
"q2":[
"13",
"12",
],
"q3":"test",
};
const result = Object.keys(data).map(key => {
let item = {id: key.substring(1), answers: []};
if(typeof data[key] === "string")
item.answers.push({answer: data[key]});
else
item.answers = data[key].map(val => ({answer: val}));
return item;
});
console.log(result)
const inputData = [
{
"q1":"5",
"q2":[
"13",
"12",
],
"q3":"test",
}
]
function answerMapper(objVal, id){
return Array.isArray(objVal)
?
{ id, answers: objVal.map(answer => ({ answer }))}
:
{ id, answers: [{answer: objVal }] }
}
function formatObject(obj){
return Object.keys(obj).map((k, i) => answerMapper(obj[k], i+1));
}
const result = inputData.map(obj => formatObject(obj));
// remove flatMap if your inputData has more than one entry
console.log(result.flatMap(x => x));
map over the first element of the data with Object.entries, grab the key and value, create a new answers array and return a new object.
const data = [{
"q1": "5",
"q2": [
"13",
"12",
],
"q3": "test",
}];
const out = Object.entries(data[0]).map(obj => {
const [ key, value ] = obj;
const id = Number(key[1]);
// If the the value is an array
// return a new array of mapped data
// Otherwise return an array containing
// one object
const answers = Array.isArray(value)
? value.map(el => ({ answer: el }))
: [{ answer: value }];
// Return the new object
return { id, answers };
});
console.log(out);
lets create a pure function which accepts the object in the array like so
const processObject = obj => Object.keys(obj).map(id => {
const answer = obj[id];
const answers = Array.isArray(answer) ? answer : [answer]
const answerObjectArray = answers.map(ans => ({
answer: ans
}));
return {
id: +id.substring(1),
answers: answerObjectArray
}
});
const dataArray = [{
"q1": "5",
"q2": [
"13",
"12",
],
"q3": "test",
}];
const output = processObject(dataArray[0]);
console.log(output);

Convert array of objects to an object

I have created this function, however is not quite right. I get this response from it:
[
{
manufacturer: [
'AUDI'
]
},
{
body_colour: {
'BLACK'
}
}
]
However what I want is:
{
manufacturer: [
'AUDI'
],
body_colour: {
'BLACK'
}
}
How can I get to this? This is what I have at the moment:
checkForQueryString() {
const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());
let searchParams = Object.entries(params).map(([key, value]) => {
return {
[key]: value.split(',')
}
});
return searchParams;
},
Query String: ?manufacturer=AUDI&body_colour=BLACK
Use reduce not map
const params = {
manufacturer: "AUDI",
body_colour: "BLACK"
}
let searchParams = Object.entries(params).reduce((acc, [key, value]) => {
return {
...acc,
[key]: value.split(',')
}
}, {});
console.log(searchParams)
Object.fromEntries(urlSearchParams.entries()), Object.entries(params) are not necessary.
You can use a simple forEach function to achieve the desired result as from MDN DOCS.
function checkForQueryString() {
const searchParams = new URLSearchParams(window.location.search);
var result = {};
searchParams.forEach(function(value, key) {
result[key] = value.split(',');
});
return result;
}
console.log( checkForQueryString() );
When url is http:example.com?manufacturer=audi,tesla&body_colour=black,white
the output would be
{
"manufacturer": [
"audi",
"tesla"
],
"body_colour": [
"black",
"white"
]
}
Assumin you meant by your input:
body_colour: [
'BLACK'
]
The answer can be:
let myArray = [
{
manufacturer: ['AUDI']
},
{
body_colour: ['BLACK']
}
];
let newObj = Object.assign({}, ...myArray)
You can make use of Object.fromEntries with split and map:
const str = 'manufacturer=AUDI&body_colour=BLACK';
console.log(Object.fromEntries(str.split('&').map(o=>[o.split('=')[0],[o.split('=')[1]]])));

React Native SectionList Split Dates

I need to reformat my object of dates and I have an array of dates in such format:
Object {
"FREETIME": "2021-04-19 11:30:00",
},
Object {
"FREETIME": "2021-04-19 12:00:00",
},
Object {
"FREETIME": "2021-04-20 12:30:00",
},
Object {
"FREETIME": "2021-04-21 12:50:00",
},
and I would want to render them in section list like this:
const DATA = [
{
title: "2021-04-19",
data: ["11:30:00", "12:00:00"]
},
{
title: "2021-04-20",
data: ["12:30:00"]
},
{
title: "2021-04-21",
data: ["12:50:00"]
},
];
so what I do is first split the array of FREETIME by days and times:
const dates = data.map((item) => item.FREETIME.split(" "));
then I get unique days for section header of SectionList:
function onlyUnique(value, index, self) {
return self.indexOf(value) === index;
}
const days = dates.map((item) => item[0]).filter(onlyUnique);
and then I try to construct new object DATA with days and corresponding times but fail at mapping the times correctly:
const DATA = days.map((dayHeader) => ({
title: dayHeader,
data: //don't know how to map it properly here
}));
What am I doing it wrong or is there another approach to this?
Below is one method of doing the job with Array.prototype.reduce
const arrayOfObjectDates = [
{
"FREETIME": "2021-04-19 11:30:00",
},
{
"FREETIME": "2021-04-19 12:00:00",
},
{
"FREETIME": "2021-04-20 12:30:00",
},
{
"FREETIME": "2021-04-21 12:50:00",
}
];
const DATA = arrayOfObjectDates.reduce((op, { FREETIME }) => {
var [date, time] = FREETIME.split(" "), { result, index } = op;
if (index.hasOwnProperty(date)) {
result[index[date]].data.push(time);
} else {
index[date] = result.length;
result.push({ title: date, data: [time] });
}
return op;
}, { result: [], index: {} }).result;
console.log(DATA)

Remove entire key when matched with matched array values

I am new to react, I have an object and an array, I want to get details of unmatched items from the object when compared with array values. I tried but shows all the data when consol.log. here is my code
var content:[
0:{id:20, name:'Jack Daniel'}
1:{id:21, name:'Sophie McDonald'}
2:{id:22, name:'Jason Thomas'}
3:{id:23, name:'Chris Williams'}
]
var filter:[Sophie McDonald, Chris Williams]
filterValues = content.filter(item=> {
for(var i = 0;i<filter.length;i++) {
if (item.name === filtered[i])
{
return item
}
}
});
console.log(filteredValues)
// returns 0:{id:21, name:'Sophie McDonald'}
// 1:{id:23, name:'Chris Williams'}
But I need unmatched results,
filterValues = content.filter(item=> {
for(var i = 0;i<filter.length;i++) {
if (item.name !== filtered[i])
{
return item
}
}
});
console.log(filteredValues)
// returns 0:{id:20, name:'Jack Daniel'}
// 1:{id:21, name:'Sophie McDonald'}
// 2:{id:22, name:'Jason Thomas'}
// 3:{id:23, name:'Chris Williams'}
Result must be
0:{id:20, name:'Jack Daniel'}
1:{id:22, name:'Jason Thomas'}
Try using filter, checking if the values of the array are present in your object values:
const content = [{
id: 20,
name: 'Jack Daniel'
},
{
id: 21,
name: 'Sophie McDonald'
},
{
id: 22,
name: 'Jason Thomas'
},
{
id: 23,
name: 'Chris Williams'
}
];
const values = ['Sophie McDonald', 'Chris Williams'];
const filteredValues = content.filter(({
name
}) => !values.includes(name));
console.log(filteredValues);
Seems to work with a few edits to the format:
let content = [
{id:20, name:'Jack Daniel'},
{id:21, name:'Sophie McDonald'},
{id:22, name:'Jason Thomas'},
{id:23, name:'Chris Williams'}
]
let filter = ["Sophie McDonald", "Chris Williams"]
let filterValues = content.filter(item=> {
for(var i = 0;i<filter.length;i++) {
if (item.name !== filter[i]){
return item
}
}
});
console.log(filterValues)

Categories

Resources