Extracting an object from an array in Javascript - javascript

I am working on a D3.JS chart using an array named "dataset" where each entry is an object with a key and value attributes, such as the following:
dataset=
[
{"key":"alpha", "value": [ {}, { } ...]},
{"key":"beta", "value": [ { }, { } ...]},
{"key":"gamma", "value": [ {}, { } ...]},
{"key":"delta", "value": [ { }, { } ...]}
];
I need to extract one of those objects to create a new array. I have tried the following:
filteredDataset = dataset.filter(function(d){ console.log("d",d); if(d.key === "gamma") return d});
I can see in the console that I am accessing each object in the dataset, but the resulting filteredDataset comes out empty. What am I doing wrong?

For clarity filter should be used by returning a boolean:
Like:
filteredDataset = dataset.filter(function(d){ return d.key === "gamma"})
And on my end the code
var dataset = [
{"key":"alpha", "value": [ {}, { }]},
{"key":"beta", "value": [ { }, { }]},
{"key":"gamma", "value": [ {}, { }]},
{"key":"delta", "value": [ { }, { }]}
];
filteredDataset = dataset.filter(function(d){ return d.key === "gamma"})
Outputs:
[ { key: 'gamma', value: [ {}, {} ] } ]
So please double check your code

dataset.filter(function(d){return d.key === 'gamma';});
This returns the data where key === gamma.
https://github.com/mbostock/d3/wiki/Selections#filter

Related

Problem mapping over data from API as its just an object not an array of objects in React

If I have this data structure coming from an api:
{
"value": 0,
"time": [
"2021-10-15"
],
"innerArray": [
{
"name": "string",
"Value": [
0
]
}
]
}
I am trying to access the element by:
let dataLoop = data // object from api
then I am doing:
function Loop() {
dataLoop.map((inner: any) => {
console.log('series =', inner.innerArray);
})
};
But I am getting TypeError: dataLoop.map is not a function
It is because
{
"value": 0,
"time": [
"2021-10-15"
],
"innerArray": [
{
"name": "string",
"Value": [
0
]
}
]
}
is an object, you can map only on Array type elements.
innerArray is an element on which you can .map like this:
dataLoop.innerArray.map((inner: any) => {
console.log('series =', inner);
})
to be able to map through an object you have to use Object like:
Object.entries(data).map(([key,value])=>{
console.log(key,value)
})
for example, so output would be like :

how to make nested array objects in javascript in a key value pair format

array data=[
{
"id":1,
"name":"john",
"income":22000,
"expenses":15000
},
{
"id":2,
"name":"kiran",
"income":27000,
"expenses":13000
},
{
"id":1,
"name":"john",
"income":35000,
"expenses":24000
}
]
i want to make a new array set in following format which is in a key value pair. ie result set.
can you please explain the best method. ? how to achive using foreach.?
tried using foreach method by looping each element. but cant get the desired output format
var result= [ {
"name": "john",
"series": [
{
"name": "income",
"value": 22000
},
{
"name": "expenses",
"value": 15000
},
]
},
{
"name": "kiran",
"series": [
{
"name": "income",
"value": 27000
},
{
"name": "expenses",
"value": 13000
},
]
}]
// Your array
const result = [
{
name: "john",
series: [
{
name: "income",
value: 22000,
},
{
name: "expenses",
value: 15000,
},
],
},
{
name: "kiran",
series: [
{
name: "income",
value: 27000,
},
{
name: "expenses",
value: 13000,
},
],
},
];
// What is .map function?
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
// Output
// map return a new function.
// it's a loop method but more equipped
result.map((item, index) => {
const seriesKeyValues = {};
// forEach is too, it's a loop method.
// but not have a return value,
// just loops and give you item on each loop
item.series.forEach(serie => {
//seriesKeyValues is a object.
// different between seriesKeyValues.serie.name
// it's a bracket notation
// look this documentation
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#computed_property_names
seriesKeyValues[serie.name] = serie.value;
});
// return new Object
// ... is 'spread syntax' basically combine objects
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer#spread_properties
// spread syntax is a new way.
// old way is https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
return {
id: index,
name: item.name,
...seriesKeyValues,
};
});
I hope it will help :). if you don't understand any lines of code, i can explain

Check if nested arrays in object contains empty values

Consider the following object:
{
"params": {
"time_to_diagnosis": [
{
"field": "date_of_diagnosis",
"value": ""
},
{
"field": "date_of_symptom_onset",
"value": "2019-09-01"
}
],
"time_since_onset": [
{
"field": "date_of_symptom_onset",
"value": "2019-09-01"
}
]
}
}
As you can tell this is a object , of objects with arrays that them selves contains objects.
As you can see some keys are empty.
The idea is that if there are no empty keys in the arrays containing objects, then return true, else return false.
Heres what I wrote:
const isParamsInAjaxParamsEmpty = (paramsForAjaxCall) => {
for (const key in paramsForAjaxCall) {
for (const nestedKey in paramsForAjaxCall[key]) {
const params = paramsForAjaxCall[key];
if (params[nestedKey] === "") {
return true;
}
}
}
return false;
}
I Know I can do an Array.isArray on the nestedKey part, but Im not sure how to make this recursive, as there could be one or more arrays.
paramsForAjaxCall is the object above.
Thoughts?
you can map the array then take the values from the Object and with every will get a boolean value so it's an array of booleans in the end because we mapping.
if this array contains a false so the result is false
const data = {
"params": {
"time_to_diagnosis": [{
"field": "date_of_diagnosis",
"value": "ddd"
},
{
"field": "date_of_symptom_onset",
"value": "2019-09-01"
}
],
"time_since_onset": [{
"field": "date_of_symptom_onset",
"value": "2019-09-01"
}]
}
}
const res = !Object.values(data).map(o => Object.values(o).map(value => value.every(({
value
}) => value !== ""))).flat().includes(false)
console.log(res)
You could take a check for not object and return false, then check for the wanted property or iterate all properties.
function check(object) {
if (!object || typeof object !== 'object') return false;
if (object.value) return true;
return Object.values(object).every(check);
}
var object = { params: { time_to_diagnosis: [{ field: "date_of_diagnosis", value: "" }, { field: "date_of_symptom_onset", value: "2019-09-01" }], time_since_onset: [{ field: "date_of_symptom_onset", value: "2019-09-01" }] } }
console.log(check(object));
object.params.time_to_diagnosis[0].value= "foo";
console.log(check(object));

How can I flatten nested arrays in JavaScript?

I have complicated array with nested arrays.
For example if I want to get data from last array then I have to write:
partners[0].products[0].campaigns[0].nameCampaign or .type or .price etc.
I'd like to flatten this array. And this is what I expect:
Is it possible at all?
#EDIT
This is part of console.log(JSON.stringify(partners, 0, 4));:
[{
"_id": "57727902d0a069e41a34eece",
"namePartner": "Self",
"products": [{
"_id": "57727910d0a069e41a34eed0",
"nameProduct": "Singl",
"campaigns": [{
"_id": "57727937d0a069e41a34eed1",
"type": "lead",
"nameCampaign": "Camp 0"
}]
}, {
"_id": "5774cb68c594b22815643b37",
"nameProduct": "DrugiPartner"
"campaigns": [{
"_id": "5774cb78c594b22815643b38",
"type": "subscription",
"nameCampaign": "DrugaKampania"
}, {
"_id": "5774cbedc594b22815643b3a",
"type": "subscription",
"nameCampaign": "TrzeciaKampania"
}, {
"_id": "5774cbf9c594b22815643b3b",
"type": "subscription",
"nameCampaign": "CzwartaKampania"
}]
}, {
"_id": "5774cbdbc594b22815643b39",
"nameProduct": "Trzeci"
"campaigns": []
}]
}]
In plain Javascript you could use an array with the references to the wanted items and the arrays and use an iterative recursive approach to get the wanted array.
Edit
For more than one property to add, you could use an array for more than one item.
One property:
{ use: 'namePartner' }
Multiple properties:
{ use: ['nameCampains', 'type'] }
function iter(a, r, l) {
if (Array.isArray(a)) {
a.forEach(function (b) {
var use = level[l].use,
rr = JSON.parse(JSON.stringify(r));
(Array.isArray(use) && use || [use]).forEach(function (c) {
rr[c] = b[c];
});
iter(b[level[l].array], rr, l + 1);
});
return;
}
result.push(r);
}
var partners = [{ namePartner: 'Tesco', products: [{ nameProduct: 'New', campains: [{ nameCampains: 'Apple', type: 'appleType' }, { nameCampains: 'Lenovo', type: 'lenovoType' }] }] }, { namePartner: 'Eko', products: [{ nameProduct: 'Fresh', campains: [{ nameCampains: 'Asus', type: 'asusType' }, { nameCampains: 'Dell', type: 'dellType' }] }, { nameProduct: 'new', campains: [{ nameCampains: 'Samsung', type: 'samsungType' }] }] }],
level = [{ use: 'namePartner', array: 'products' }, { use: 'nameProduct', array: 'campains' }, { use: ['nameCampains', 'type'] }],
result = [];
iter(partners, {}, 0);
console.log(result);
You could use get from lodash:
var CAMPAIGN_NAME_PATH = ['partners', 0, 'products', 0, 'campaigns', 0, 'nameCampaig'];
var campaignName = _.get(JSONObject, CAMPAIGN_NAME_PATH, 'optionalDefaultCampaignName');
Or you could try playing with flatten, flattenDeep and flattenDepth and rearrange the JSON object structure first before accessing it (note that these three methods only work on arrays, not key-value objects).

group by/formatting json data in Javascript

Sorry if this has been asked before. I have the JSON structure like:
{"data":[
{"Date":"03/04/2016","Key":"A","Values":"123"},
{"Date":"04/04/2016","Key":"A","Values":"456"},
{"Date":"03/04/2016","Key":"B","Values":"789"},
{"Date":"04/04/2016","Key":"B","Values":"012"}
]}
I want to change this to a different format which is basically grouped by Key and combines rest of the field in Values
{"Result":[
{
"Key":"A"
"Values":[["03/04/2016","123"], ["04/04/2016","456"]]
},
{"Key":"B"
"Values":[["03/04/2016","789"]},["04/04/2016","012"]]
}
]}
I want to do this javascript/html
You could iterate and build a new object if not exist.
var object = { "data": [{ "Date": "03/04/2016", "Key": "A", "Values": "123" }, { "Date": "04/04/2016", "Key": "A", "Values": "456" }, { "Date": "03/04/2016", "Key": "B", "Values": "789" }, { "Date": "04/04/2016", "Key": "B", "Values": "012" }], result: [] };
object.data.forEach(function (a) {
if (!this[a.Key]) {
this[a.Key] = { Key: a.Key, Values: [] };
object.result.push(this[a.Key]);
}
this[a.Key].Values.push([a.Date, a.Values]);
}, Object.create(null));
console.log(object);
I think this can be a better answer (but Nina's answer is the match for your problem terms) if items of data array have different properties and you don't want to change input data.
var raw = {"data":[
{"Date":"03/04/2016","Key":"A","Values":"123"},
{"Date":"04/04/2016","Key":"A","Values":"456"},
{"Date":"03/04/2016","Key":"B","Values":"789"},
{"Date":"04/04/2016","Key":"B","Values":"012"}
]};
var result = new Map;
raw.data.forEach(entry => {
var key = entry.Key;
if (this[key])
return this[key].push(getClonedData(entry));
this[key] = [getClonedData(entry)];
result.set(key, {
Key: key,
Values: this[key]
})
}, Object.create(null));
var filtered = {
result: [...result.values()]
}
console.log(filtered);
function getClonedData(entry) {
data = Object.assign({}, entry);
delete data.Key;
return data;
}

Categories

Resources