How to assign values one by one from an array of objects? - javascript

I have an array of objects this.selection.selected which can have one or more values.
The below code is working fine if the array has only one value.
0: {hostName: "abc123"}
length: 1
console.log(this.selection.selected);
const dialogRef = this.dialog.open(saDialogComp, {
width: '600px'
data: {
hostName: this.selection.selected[0].hostName
}
});
How to make it work if the array has multiple objects as below?
0: {hostName: "abc123"}
1: {hostName: "abc456"}
length: 2

Because your this.selection.selected is an array, you can map a function over it to get all of the hostnames from the objects.
Depending on what your this.dialog.open needs to accept as the second parameter, you can try to modify your data to something like this:
const dialogRef = this.dialog.open(saDialogComp, {
width: '600px',
data: {
hostNames: this.selection.selected.map(a => a.hostName)
}
});
hostNames will now be an array of values from those objects, like:
[ 'abc123', 'abc456' ]
This will work with any amount of values in the array, be it one or 1000.

If you intend data.hostName to be a string, then you can:
// ...
data: {
hostName: this.selection.selected.map(o => o.hostName).join(', ')
}
This will:
convert the array of objects to an array of strings (only the value of the name);
join those strings into a single comma-separated string

Related

Format array for batch api call in Javascript

I have an array with this format:
var customerList = [{'email: ex#mail.com', 'name': 'John'}, {...}, {...}]
However I need to format a batch api call for the following format for each of the objects in the array:
api.post('/:batch_endpoint'), {
0: {url: '/:endpoint', data: {email: customerList[0].email}},
1: {...},
2: {...},
}
So essentially I'm wondering if there's a way to dynamically fill the records for the api call from that array or another list. So far I've tried to use Object.assign() but not sure if this is the right way forward:
var customerObject = Object.assign({}, customerList) outputs:
{
'0': {
email: 'ex#mail.com',
'...',
},
1: {...}
}
Beyond this point I'm not sure how I can format this api call properly.
Assuming that you're asking how to send batch updates as a 1st index-based array (instead of 0th index-based) you have at least a couple of options:
Option 1: Use the reduce method to add one to the key:
customerList.reduce((acc, data, idx) => ({
...acc,
[parseInt(idx) + 1]: {
url: "/:endpoint",
data
}
}), [])
Option 2: Use the unshift method to add a "garbage" value to the 0th index:
// Convert the values in the array into the shape you want to send
customerList.map(data => ({ url: "/:endpoint", data }))
// Insert garbage value at index 0
customerList.unshift(0)
Option 3: Update your API to support 0th indexed-arrays if you plan on sending data frequently. IMO, the above two solutions are a hack and less than ideal. However, this may not be possible in your situation.

Angular get difference function object key

I am trying to compare two or multiple objects using difference() function and then use the object(s) key value to push into an array of just url's, but I can't use dot syntax on an object for some reason any hints?
array this.stores
[
{
name: "Google Play"
url: "https://play.google.com"
}
]
array result
[
{
name: "Google Play"
url: "https://play.google.com"
},
{
name: "Steam Store"
url: "https://store.steampowered.com"
}
]
I'm comparing these 2 arrays of objects like this:
const storesDifference = difference(result, this.stores);
// works as it should stores 'Steam Store'
console.log('difference', storesDifference.url);
// I'm trying to return URL key using dot syntax but without any success
managed to solve this problem using filter function. Works as i wanted.
see below:
const array3 = this.stores
.filter((x) => !result.includes(x))
.concat(result.filter((x) => !this.stores.includes(x)));

Immutable.fromJS() is not deeply converting my JSON to Immutable object

I have 2 given immutable lists and I am concatenating them as follows:
const fruits = Immutable.List(['apple', 'banana']);
const vegetables = Immutable.List(['carrot']);
const groceries = fruits.concat(vegetables);
I used map function to transform data to get list of objects and finally converted it to immutable using fromJS like below:
const result = groceries.map((item, index) => ({ id: index, item }));
const checkList = Immutable.fromJS({ groceries: result });
So the final data is the immutable object of the given JSON:
{
"groceries": [
{
"id": 0,
"item": "apple"
},
{
"id": 1,
"item": "banana"
},
{
"id": 2,
"item": "carrot"
}
]
}
I expect fromJS would deeply convert the object { groceries: result } to immutable object. But when I check the value of checkList.getIn(['groceries', '0']) I get a plain JSON object {id: 0, item: 'apple`} instead of the expected immutable map.
Can someone help me out why this happens
Quoting the statements in immutableJS repo
Immutable.fromJS() is conservative in its conversion. It only converts plain Objects (no custom prototype) to Immutable.Map and true Arrays to Immutable.List. This ensures that exotic objects (Date objects, DOM nodes, user-defined types) don't get converted to Immutable.Map unintentionally.
So it converts only plain Objects. In your case before fromJS is used the data looks like below:
{
groceries: <Immutable List>
}
And within the list, each element is stored as plain JSON object like below:
{ id: 0, item: 'apple'}
fromJS converts your data to immutable until it encounters anything other than plain Objects and true Arrays. That's why it didn't convert the elements in the immutable list as it is not true Array.
Your problem could be solved by adding fromJS to the below code
const result = groceries.map((item, index) => fromJS({ id: index, item }));

Parse data into separate, labeled arrays

I have an array of some data like this:
anonymous {
id: 1680,
data:
{ _ID: 0,
JOB_ID: 1333,
RecNum: 11832338,
Pressure: 999.439,
Pressure2: 714.131 },
creationDate: 2018-05-09T14:00:23.199Z,
job: 1 }
What I need to do is have each item that has pressure be put into its own array. So in this case I would end up with two arrays, Pressure and Pressure2, with those being the labels of each array
This code here only makes one array with double the values
Object.keys(this.query.rows).forEach(blob =>{
pipelines.data.push( this.query.rows[blob].data.Pressure)
pipelines.data.push( this.query.rows[blob].data.Pressure2)
pipelines.creationDate.push( this.query.rows[blob].creationDate)
})
I have also tried using the map function but in several attempts, I only get 'undefined' as a result.
I can get the keys of my data but how do I use this to test my data and put into the proper array?
const myDataKeys = Object.keys(this.query.rows[0].data);

Array filteration and Extraction of data and append to new Array

I have an array with nested array
I want the data to append in a new array.
For the data extraction or filtration what method's i have to use, using library such as lodash
DATA
[
[
{
_id: 588d9b8a608f2a66c298849f,
email: 'sd#',
password: '$2a$10$6..L3c3tANi6ydt9gZbc1O6prPfUd3RB.ner5lilxRyEwo1lPsSoC',
isJobSeeker: true,
__v: 0,
lastName: 'shrestha',
firstName: 'manish',
isSeeker: true
}
],
[
{
_id: 588dbb4f7a48ce0d26cb99fd,
jobId: [Object],
seekerId: 588d9b8a608f2a66c298849f,
employerId: 588d7d6c0ec4512feb819825,
__v: 0,
}
]
]
REQUIRED DATA
[
{
_id: 588d9b8a608f2a66c298849f,
email: 'sd#',
password: '$2a$10$6..L3c3tANi6ydt9gZbc1O6prPfUd3RB.ner5lilxRyEwo1lPsSoC',
isJobSeeker: true,
__v: 0,
lastName: 'shrestha',
firstName: 'manish',
isSeeker: true
},
jobId: [{}, {}, {}] // ARRAY WITH OBJECTS
]
also i want to change the jobId key to other key of custom string as jobs
Following is my attempt:
console.log('Data filteration', data);
const filteredData = [];
filteredData.push(data[0][0]);
data[1].forEach((i) => {
filteredData[0].jobs = i.jobId
});
console.log('filteredData', filteredData);
First you should clean you data to have a better structure.
[
[
{ ... }
],
[
{ ... }
]
]
In this datastructure, its difficult to understand what does inner arrays signify. Instead you should use an object. That would define the purpose of array and make your code more readable.
var data=[[{_id:"588d9b8a608f2a66c298849f",email:"sd#",password:"$2a$10$6..L3c3tANi6ydt9gZbc1O6prPfUd3RB.ner5lilxRyEwo1lPsSoC",isJobSeeker:!0,__v:0,lastName:"shrestha",firstName:"manish",isSeeker:!0}],[{_id:"588dbb4f7a48ce0d26cb99fd",jobId:["test","test1"],seekerId:"588d9b8a608f2a66c298849f",employerId:"588d7d6c0ec4512feb819825",__v:0}]];
var cleanedData = {
userData: data[0],
userJobMap: data[1],
}
var result = cleanedData.userData.reduce(function(p,c){
if(c.isJobSeeker){
var job = cleanedData.userJobMap.filter(x=> x.seekerId === c._id);
// To copy object and not reference
var t = Object.assign({}, c, { jobId: job[0].jobId });
p.push(t)
}
return p
}, [])
console.log(result)
References
Array.map is a tool that iterates over all elements and return different value say a single property of return double value of all numbers in array. Note, this will yield an array of same size.
Array.filter on the other hand is use to filter array based on condition. This will return a subset of original data but elements will be same. You cannot change element structure.
Array.reduce is a tool that address cases where you need to return selected elements with parsed value. You can achieve same by chaining .filter().map() but then its an overkill as it would result in O(2n).
Object.assign In JS objects are passed by reference. So if you assign an object to a variable, you are not copying entire object, but only reference. So it you change anything in this variable, it will also reflect in original object. To avoid this, you need to copy value. This is where Object.assign comes. Note, its not supported by old browsers. For them you can check following post - What is the most efficient way to deep clone an object in JavaScript?
Note: All array functions are part of functional programming paradigm and are used to make your code more readable and concise but they come at an expense of performance. Traditional for will always perform faster then them. So if you want to focus on performance, always try to use for (though difference is very small but can add up for multiple cases and become substantial)

Categories

Resources