This question already has answers here:
Extract certain properties from all objects in array
(5 answers)
Closed 1 year ago.
I am trying to filter selected property from object using JavaScript.
This is my array
const odata=[
{
"id": "0001",
"type": "donut",
"name": "Cake",
"ppu": 0.55,
},
{
"id": "0002",
"type": "ansd",
"name": "EARK",
"ppu": 0.67,
}
];
I want output like this - I want to select only 2 (id,type) props from the object
[
{"id": "0001","type": "donut"}
{"id": "0002","type": "ansd"}
]
We can use Array.map and some Destructuring to get the desired result.
The destructuring assignment syntax allows us to get selected values from Objects and Arrays in a convenient way.
const odata= [ { "id": "0001", "type": "donut", "name": "Cake", "ppu": 0.55, }, { "id": "0002", "type": "ansd", "name": "EARK", "ppu": 0.67, } ];
const result = odata.map(({ id, type}) => ({ id, type }));
console.log("Result:", result)
User Array.prototype.map() for generating a new array from an existing one.
Reference
const odata = [
{ "id": "0001", "type": "donut", "name": "Cake", "ppu": 0.55 },
{ "id": "0002", "type": "ansd", "name": "EARK", "ppu": 0.67 }
];
const output = odata.map(node => ({
id: node.id,
type: node.type,
}))
console.log(output)
Related
How to use filter or forEach in javascript to output only the objects whithout parentId and the objects with only the first level of parentId.
Should output objects with ids: 1681, 1682, and 1683.
Should not output objects with ids: 1685, 1686 and 1687.
array = [ {
"id": 1681,
"label": "1",
"url": "page1",
},
{
"id": 1682,
"label": "2",
"url": "page1",
},
{
"id": 1683,
"label": "a",
"url": "page1",
"parentId": 1681,
},
{
"id": 1685,
"label": "aa",
"url": "page1",
"parentId": 1683,
},
{
"id": 1686,
"label": "aaa",
"url": "page1",
"parentId": 1683,
},
{
"id": 1687,
"label": "aaaa",
"url": "page1",
"parentId": 1683,
}
]
Something like this...
array.filter(({item}) => !item.parentId ? item.id : item.parentId)
We have to save the information if we already found a parentId from inside the filter function. A handy way to do this is by using the prefix operator ++ on a counter. This way we get around an explicit, long assignment with =. Instead we make it before.
Additionally with destructuring assignment we can extract the parentId comfortably of the array items and write a really short filter:
array=[{id:1681,label:"1",url:"page1"},{id:1682,label:"2",url:"page1"},{id:1683,label:"a",url:"page1",parentId:1681},{id:1685,label:"aa",url:"page1",parentId:1683},{id:1686,label:"aaa",url:"page1",parentId:1683},{id:1687,label:"aaaa",url:"page1",parentId:1683}];
window.parentIdCount = 0;
window.filtered =
array.filter(({parentId}) => !parentId || ++parentIdCount <= 1)
console.log(filtered)
Something like this ought to work:
const result = array.filter(object => object.parentId === undefined);
I'm trying to filter some objects based on another array of objects. So I'm getting data from an API. These are for example receipts:
[
{
"id": 1,
"name": "test",
"category": {
"id": 1,
"name": "Cookies",
},
},
{
"id": 2,
"name": "test2",
"category": {
"id": 2,
"name": "Candy",
},
}
]
Then I'm trying to filter the objects on the category name based on another array of categories.
I've created a function for this:
function onSelectCategory(category) {
let receiptsList = receipts.filter((a) =>
a.category.includes(category.name)
);
setReceiptsView(receiptsList);
setSelectedCategory(category);
}
const category = [ { "id": 2, "name": "Candy" } ];
onSelectCategory(category);
When I run this function, I get an empty Array []. I can't really figure out what I'm doing wrong.
Since the param seems to be an array of objects, you need to use Array#some for comparison instead:
const receipts = [
{ "id": 1, "name": "test", "category": { "id": 1, "name": "Cookies" } },
{ "id": 2, "name": "test2", "category": { "id": 2, "name": "Candy" } }
];
const categories = [ { "id": 2, "name": "Candy" } ];
const receiptsList = receipts.filter(({ category }) =>
categories.some(({ name }) => name === category.name)
);
console.log(receiptsList);
Another solution using Set:
const receipts = [
{ "id": 1, "name": "test", "category": { "id": 1, "name": "Cookies" } },
{ "id": 2, "name": "test2", "category": { "id": 2, "name": "Candy" } }
];
const categories = [ { "id": 2, "name": "Candy" } ];
const categorySet = new Set(categories.map(({ name }) => name));
const receiptsList = receipts.filter(({ category }) =>
categorySet.has(category.name)
);
console.log(receiptsList);
Assuming that category (the parameter) is a string, the issue is that you are attempting to get the attribute name from the string, when you should be comparing the string to the object.
Try this:
a.category.name == category;
instead of
a.category.includes(category.name)
I may be wrong aboout assuming that category is a string, please clarify by telling us what the parameter category is equal to.
I want to assign a new Value (let say this is a flag such as isActive) from an existing object. this is an example for the object I'm using to try:
let localValue = {
"id": "019eadd3-2e71-4446-a195-69d849d88a43",
"discount": {
"code": "PFMQWERTY",
"id": "019eadd3-2e71-4446-a195-69d849d88a43",
"isActive": false
},
"discountId": "019eadd3-2e71-4446-a195-69d849d88a43",
"discountRules": [
{
"id": "1-1",
"type": "FIXED",
"value": 30000,
"package": {
"id": "1-1-A",
"name": "Package A",
"maxDiscountInApps": 3,
"discountInApps": [
{
"id": "1-1-A-A",
"code": "QWERTY",
"expirationDate": "2034-02-28T00:00:00+0000"
}
]
}
},
{
"id": "1-2",
"type": "FIXED",
"value": 100000,
"package": {
"id": "1-2-A",
"name": "Package B",
"maxDiscountInApps": 3,
"discountInApps": [
{
"id": "1-2-A-A",
"code": "KASH",
"expirationDate": "2032-02-03T00:00:00+0000"
}
]
}
},
{
"id": "1-3",
"type": "FIXED",
"value": 15000,
"package": {
"id": "1-3-A",
"name": "Package C",
"maxDiscountInApps": 3,
"discountInApps": []
}
},
{
"id": "1-4",
"type": "FIXED",
"value": 180000,
"package": {
"id": "1-4-A",
"name": "Package D",
"maxDiscountInApps": 3,
"discountInApps": []
}
},
{
"id": "1-5",
"type": "FIXED",
"value": 15000,
"package": {
"id": "1-5-A",
"name": "",
"maxDiscountInApps": 3,
"discountInApps": []
}
},
{
"id": "1-6",
"type": "FIXED",
"value": 30003,
"package": {
"id": "1-6-A",
"name": "Package E",
"maxDiscountInApps": 3,
"discountInApps": [
{
"id": "1-6-A-A",
"code": "QWERTY",
"expirationDate": "2034-02-28T00:00:00+0000"
},
{
"id": "1-6-A-B",
"code": "KASH",
"expirationDate": "2032-02-03T00:00:00+0000"
},
{
"id": "1-6-A-C",
"code": "ANT",
"expirationDate": "2021-07-30T00:00:00+0000"
}
]
}
},
{
"id": "1-7",
"type": "FIXED",
"value": 5000,
"package": {
"id": "1-7-A",
"name": "Package F",
"maxDiscountInApps": 3,
"discountInApps": []
}
}
],
"expirationDate": "28/02/2034 07:00:00",
"totalPackagesShown": 2
}
the goals I want to achieve is to check if there is the same code in discountRules.package.discountInApps.code === this.localValue.discount.code then return true, if failed then return false.
I can already find the way to set it using map() and some() like this:
this.localValue.discountRules = this.localValue.discountRules.map(
rule => ({
...rule,
isActive:
rule.package &&
rule.package.discountInApps &&
rule.package.discountInApps.length !== 0
? rule.package.discountInApps.some(
ruleItems =>
ruleItems.code === this.localValue.discount.code
)
: false
})
);
but performance wise, is it better using map() and reducer() combination for this case or better stay using map() and some()? because I read it in here Array.prototype.reduce() it seems when using reducer can make an array reduce until it finds a value that I want (is my understanding correct?) so if it's true then...
is it better using this map() and reducer() (if its possible) or stay with map() and some() combination?
(I'm still failed to implement map() and reducer(), so can someone tell me how to use this (map() and reducer()) combination?)
Notes:
if by any chance there is a better way, I'm open for it
just in case, I'm already try to read this thread but still not quite understand as how to implement it in my case:
remove-object-from-array-using-javascript
If you prefer performance, the traditional for loop would be the fastest.
For execution times, I get these
Map & Some: 27ms average
Map & Reduce: 32ms average
You can use console.time() and console.timeEnd() to check for execution times.
The array Reduce method will run a callback function on each element of the supplied array and will return the calculated value from the callback (the value will be stored in the index of the element). If you want to use reduce with map, you can do something like this
localValue.discountRules = localValue.discountRules.map((rule) => ({
...rule,
isActive:
rule.package &&
rule.package.discountInApps &&
rule.package.discountInApps.length !== 0
? rule.package.discountInApps.reduce(
(accumulatedValue, currentValue) =>
accumulatedValue && currentValue.code === localValue.discount.code,
true // this is the default initial value for the accumulatedValue
)
: false,
}));
Alternatively, you can use optional chaining (?.) Like this
localValue.discountRules = localValue.discountRules.map((rule) => ({
...rule,
isActive:
rule?.package?.discountInApps?.some(
(ruleItems) => ruleItems.code === localValue.discount.code
)
}));
(Do check out the supported browsers here).
This question already has answers here:
Group array items using object
(19 answers)
Closed 3 years ago.
I have an objects with similar ids
[{
"_id": "603",
"name": 'innova',
"type": 'suv',
"brand": 'toyota'
},
{
"_id": "902",
"name": 'i20',
"type": 'hashback',
"brand": 'hyundai'
},
{
"_id": "603",
"name": 'indigo',
"type": 'haskback',
"brand": 'toyota'
}]
should be converted to
[{
"_id": "603",
"name": ['innova', 'indigo'],
"type": ['suv', 'haskback'],
"brand": ['toyota', 'toyota']
}, {
"_id": "902",
"name": ['i20'],
"type": ['hashback'],
"brand": ['hyundai']
}]
i have tried using Object.keys and Object.Values by pushing them if id already exits but failed.
Use the reduce function to build an object _id based.
Then after use Object.values() to retrieve an object as you want
const data = [{
"_id": "603",
"name": 'innova',
"type": 'suv',
"brand": 'toyota'
},
{
"_id": "902",
"name": 'i20',
"type": 'hashback',
"brand": 'hyundai'
},
{
"_id": "603",
"name": 'indigo',
"type": 'haskback',
"brand": 'toyota'
}
]
const newData = data.reduce((acc, row) => {
if (!acc.hasOwnProperty(row._id)) {
// there is no rows with the _id, we push a row into our accumulator
acc[row._id] = {
"_id": row._id,
name: [row.name],
type: [row.type],
brand: [row.brand]
};
} else {
// as the row with the _id exists, we just push values in the arrays
acc[row._id].name.push(row.name);
acc[row._id].type.push(row.type);
acc[row._id].brand.push(row.brand);
}
return acc;
}, {});
console.log(Object.values(newData));
This question already has answers here:
Object array clone with subset of properties
(3 answers)
Closed 4 years ago.
I have an array of objects:
const ObjArray= [{
"id": "90e17e10-8f19-4580-98a8-ad05f4ecd988",
"name": "john",
"description": "worker",
"place": "f.1.1",
...
},
{
"id": "90e17e10-8eqw-4sdagfr4ecd9fsdfs",
"name": "joe",
"description": "dev",
"stepType": "d.2.1",
...
}
];
I want to filter the array of objects above to return only specific properties from the objects.
Let's say I want to return only the id and the name of every object in a new array that would look like this:
[{
"id": "90e17e10-8f19-4580-98a8-ad05f4ecd988",
"name": "john"},
{
"id": "90e17e10-8eqw-4sdagfr4ecd9fsdfs",
"name": "joe" }
I searched about that but I couldn't find out how to get it the way I want.
IMHO, you are looking for something like this using Array#map:
ObjArray= [{
"id": "90e17e10-8f19-4580-98a8-ad05f4ecd988",
"name": "john",
"description": "worker",
"place": "f.1.1" },
{
"id": "90e17e10-8eqw-4sdagfr4ecd9fsdfs",
"name": "joe",
"description": "dev",
"stepType": "d.2.1",}
];
console.log(ObjArray.map(o => ({'id': o['id'], 'name': o['name']})));
If you prefer object destructuring:
ObjArray= [{
"id": "90e17e10-8f19-4580-98a8-ad05f4ecd988",
"name": "john",
"description": "worker",
"place": "f.1.1" },
{
"id": "90e17e10-8eqw-4sdagfr4ecd9fsdfs",
"name": "joe",
"description": "dev",
"stepType": "d.2.1",}
];
console.log(ObjArray.map(({id, name}) => ({id, name})));