I want to filter through an array and retrieve items if their filters match. However it does not work.
const wanted=["apple"]
const items = [
{
"name": "Iphone"
"filters": ["phone","apple"]
},
{
"name": "samsung12"
"filters": ["samsung12","samsung"]
},
]
let desiredList = items.filter((val) => wanted.includes(val.filters));
Any ideas on how i could get this to work?
You would need to use some to check if any of the filters contains a value in wanted:
const wanted = ["apple"]
const items = [{
"name": "Iphone",
"filters": ["phone", "apple"]
}, {
"name": "samsung12",
"filters": ["samsung12", "samsung"]
}];
let desiredList = items.filter((item) => item.filters.some((f) => wanted.includes(f)));
console.log(desiredList);
const wanted="apple"
const items = [
"name": "Iphone"
"filters": ["phone","apple"]
]
let desiredList =
items.filter((val)=>
val.filters.includes(wanted) )
simply you need to filter your items searching the required field, then map the result using .map for each result
here you can check it
let abc = document.querySelectorAll('div')
const wanted=["apple"]
const items = [{
"name": "Iphone",
"filters": ["phone","apple"]
},{
"name": "Iphone",
"filters": ["phone","sony"]
},{
"name": "Iphone",
"filters": ["phone","samsung"]
}]
items.filter((val) => val["filters"].includes(wanted[0])).map((item) => { item? abc[0].innerHTML += item.name+"<br />"+item.filters : console.log("none") })
<div></div>
Related
I am trying to update my product attributes and i came to a solution only for one attribute.
this is my carrtItems state
this.state = {
cartItems: [],
selectedAttributes: []
Json Object
{
"__typename": "Product",
"name": "iPhone 12 Pro",
"inStock": true,
"attributes": [
{
"__typename": "AttributeSet",
"id": "Capacity",
"name": "Capacity",
"type": "text",
"items": [
{
"__typename": "Attribute",
"id": "512G",
"value": "512G"
},
{
"__typename": "Attribute",
"id": "1T",
"value": "1T"
}
]
},
{
"__typename": "AttributeSet",
"id": "Color",
"items": [
{
"__typename": "Attribute",
"id": "Black",
"value": "#000000"
},
{
"__typename": "Attribute",
"id": "White",
"value": "#FFFFFF"
}
]
}
],
"id": "product1",
"quantity": 1,
"selectedAttributes": [
{
"value": "512G",
"type": "Capacity",
"id": "product1"
},
{
"value": "#44FF03",
"type": "Color",
"id": "product1"
}
]
}
This is my update function:
updateCartItem = (cart, product, selectedAttribute, newAttributes) => {
const existingCartItem = cart.find(
(cartItem) => cartItem.id === product.id
);
const thisCart = cart.filter((cartItem) => cartItem.id !== product.id)
if (existingCartItem) {
cart.map((cartItem) =>
cartItem.selectedAttributes.map((attr)=> attr.type===selectedAttribute.map((newAttr)=>newAttr.type
? newAttributes= [{
...attr,
value: newAttr.value,
}]
: [newAttributes = attr]
)));
return [
...thisCart,
{ ...product, selectedAttributes: newAttributes },
];
}
};
This is update state function
updateItemToCart = (product, selectedAttributes) => {
this.setState({
cartItems: this.updateCartItem(this.state.cartItems, product, selectedAttributes),
});
};
This my is my selected attributes functions
selectAttribute = (attribute, newAttribute, type, id) => {
const existingAttribute = attribute.find(
(attr) => attr.type === type && attr.id === id
);
if (existingAttribute) {
return attribute.map((attr) =>
attr.type === type && attr.id === id
? { ...attr, value: newAttribute }
: attr
);
}
return [...attribute, { value: newAttribute, type, id }];
};
selectedAttributesHandler = (newAttribute, type, id) => {
this.setState({
selectedAttributes: this.selectAttribute(
this.state.selectedAttributes,
newAttribute,
type,
id
),
});
};
What i want here is to update selectedAttributes if color or size changes but to remain the other attribute.
Example:
Color: white, Size: M
Here i change the size to L on click
Result:
Color: white, Size:L
How to update updateCartItem function to achieve this result.
You can use the spread operator
It allows you to easily populate an object or array with a shallow copy of the contect of another object or array.
The syntax is three dots followed by the name of the object or array that we want to copy.
Example:
this.setState({
...this.state,
selectedAttributes: this.selectAttribute(
this.state.selectedAttributes,
newAttribute,
type,
id
),
});
There are other ways of achieving this, but this is the likely the simplest way and is a common pattern when working with state in React.
How do i filter roles in this array to return true when "Admin" is found?
const array = [{
"country": "all",
"roles": [
"Normal",
"Admin",
]
}]
Use .filter() and .includes():
const admins = array.filter((u) => u.roles.includes("Admin"))
1.Did u mean to return a boolean overall?
In Js es6, you could use .some() MDN web docs
it's nice and simple :)
const array = [{
"country": "all",
"roles": [
"Normal",
"Admin",
]
}, {
"country": "test",
"roles": [
"Normal"
]
}]
const result = array.some(o => Boolean(o.roles.some(role => role === 'Admin')))
console.log(result) // return true
2.Or, did u mean that it returns a new array in which each roles become a boolean depending on having 'Admin' or not?
If it is, .some() works as well :)
Try below:
const array = [{
"country": "all",
"roles": [
"Normal",
"Admin",
]
}, {
"country": "test",
"roles": [
"Normal"
]
}]
const result = array.reduce((acc, curr, index) => {
const item = Object.assign({}, curr, { roles: curr.roles.some(o => o === 'Admin') })
acc.push(item)
return acc
}, [])
console.log(result) // return true
or if it filter an array, my answer is the same as Tobias' :)
const array = [{
"country": "all",
"roles": [
"Normal",
"Admin",
]
}]
const val = array.map((a) => a.roles.includes('Admin'))
console.log(val) //return true
I have an array list which needs to be converted to a single object with few of the values from array list using TypeScript in Angular 8. Below is the array:
"arrayList": [{
"name": "Testname1",
"value": "abc"
},
{
"name": "Testname2",
"value": "xyz"
}
]
This needs to be converted to the below format,
data: {
"Testname1": "abc",
"Testname2": "xyz",
}
No matter how much i try, i end up creating a list instead of a single object. Can you please help on the same?
You can use as follows,
var arr = [
{
"name": "Testname1",
"value": "abc"
},
{
"name": "Testname2",
"value": "xyz"
}
];
var result = {};
for (var i = 0; i < arr.length; i++) {
result[arr[i].name] = arr[i].value;
}
console.log(result);
Try with using .reduce() as the following:
const arrayList = [{ "name": "Testname1", "value": "abc" }, { "name": "Testname2", "value": "xyz" }];
const data = arrayList.reduce((a, {name, value}) => {
a[name] = value;
return a;
}, {});
const result = { data };
console.log(result);
Use Array.map() to get a list of [name, value] entries, then use Object.fromEntries() to convert to an object:
const arrayList = [{ "name": "Testname1", "value": "abc" }, { "name": "Testname2", "value": "xyz" }];
const result = Object.fromEntries(arrayList.map(({ name, value }) => [name, value]));
console.log(result);
Please use the below code
const rawData = {
"arrayList": [{
"name": "Testname1",
"value": "abc"
},
{
"name": "Testname2",
"value": "xyz"
}
]
};
const updatedData = {
data: {}
};
for (const item of rawData["arrayList"]) {
updatedData.data[item.name] = item.value;
}
console.log(updatedData);
Consider this object, with two channels with NL language and one with EN language:
[
{
"name": "De Redactie",
"channels": [
{
"name": "headlines",
"pubDate": "2017-05-15 09:15:00",
"language": "nl",
"items": [
]
},
{
"name": "headlines English",
"pubDate": "2017-05-14 18:05:00",
"language": "en",
"items": [
]
},
{
"name": "politiek",
"pubDate": "2017-05-14 20:11:00",
"language": "nl",
"items": [
]
}
]
}
]
How can i divide them so that i can get this result:
[
{
"name": "De Redactie",
"channels": [
{
"name": "headlines",
"pubDate": "2017-05-15 09:15:00",
"language": "nl",
"items": [
]
},
{
"name": "politiek",
"pubDate": "2017-05-14 20:11:00",
"language": "nl",
"items": [
]
}
]
}
{
"name": "De Redactie",
"channels": [
{
"name": "headlines English",
"pubDate": "2017-05-14 18:05:00",
"language": "en",
"items": [
]
}
]
}
]
Mind you that this is dummyData. The actual data can contain x amount of one language and y amount of the second or third or fourth ...
I have tried looking in the lodash documentation for the correct combination of functions. Also tried various complex forEach structures, but could not wrap my head around it.
Preferably a solution with lodash or typescript, as i'm working in Angular 4.
Iterate the array with Array#map. For each object, extract the array of channels using destructuring with object rest. Iterate the channels using Array#reduce and group channels with the same language to a Map. Convert back to an array by spreading the Map's values iterator.
Create an array of objects, by mapping them and assigning the group as the channels prop of the object. Flatten the array by spreading into Array#concat:
const data = [{"name":"De Redactie","channels":[{"name":"headlines","pubDate":"2017-05-15 09:15:00","language":"nl","items":[]},{"name":"headlines English","pubDate":"2017-05-14 18:05:00","language":"en","items":[]},{"name":"politiek","pubDate":"2017-05-14 20:11:00","language":"nl","items":[]}]}];
const result = [].concat(...data.map(({ channels, ...rest }) => {
const channelGroups = [...channels.reduce((m, channel) => {
m.has(channel.language) || m.set(channel.language, []);
m.get(channel.language).push(channel);
return m;
}, new Map()).values()];
return channelGroups.map((channels) => ({
...rest,
channels
}));
}));
console.log(result);
way with lodash:
const res = _.chain(arr)
.flatMap(item => _.map( // get array of channels with parent name
item.channels,
channel => _.assign({}, channel, { parentName: item.name })
))
.groupBy('language') // group channels by language
.values() // get channel arrays for each lang
.map(langArrs => ({ // set finished structure
name: _.first(langArrs).parentName, // get name for lang channels
channels: _.omit(langArrs, ['parentName']) // set channels without parent name
}))
.value();
I have below JSON and wanted to update the value depending on Aid, Bid and Cid using Immutable.js
e.g.
Below input provided.
Aid= A, Bid = 1, Cid= 4, NewValue = 'FOUR'
If above input is provided the value "One" needs to be changed to "FOUR"
let sampleJson = {
Aid: 'A', detail:"sample", list: [
{
"Bid": "1",
"group": [
{
"name": "Group A",
"Cid": "4",
"value": "One"
},
{
"name": "Group A",
"Cid": "41",
"value": "1"
},
]
},
{
"Bid": "2",
"group": [
{
"name": "Group A",
"Cid": "4",
"value": "1"
},
{
"name": "Group A",
"Cid": "4",
"value": "1"
},
]
};
I was able to access the value using below code. How can i return the entire JSON with updated value?
let variale = Immutable.fromJS(sampleJson).
getIn(['list']).
find(allocation => allocation.get("Bid") === "1").
getIn(['group']).
find(fun => fun.get("Cid") === "4").set('value',"FOUR");
Anyone has any suggestions on how to resolve this problem?
I think you can try to do this like so:
let immutable = Immutable.fromJS(sampleJson);
immutable = immutable.setIn(['list', 0, 'group', 0, 'value'], 'FOUR');
This monstrosity is how I would do it:
const newData = originalData.update('list', list => {
const itemIndex = list.findIndex(item => item.get('Bid') === '2');
return list.update(itemIndex, listItem => {
return listItem.update('group', groupList => {
const groupIndex = list.findIndex(group => group.get('Cid') === '4');
return groupList.update(groupIndex, group => {
return group.set('value', 'FOUR');
});
});
});
});
https://jsbin.com/latupo/7/edit?html,js,console
Personally I stopped using Immutable, I always found it a bit painful (not to mention those docs!). I now use redux and good old cloning to not mutate state. Less performant in theory but if you've got nothing that runs over a few milliseconds anyway, save yourself the trouble...