[英]Javascript Filter Non-Array JSON Object
I am trying to filter non-array JSON object as the following snippet 我试图将非数组JSON对象过滤为以下代码段
const filter = { filterRows: ['one'] }; const templateMapper = { 'one': { title: 'one', }, 'two': { title: 'two', }, 'three': { title: 'three', }, } const filterDialogView = filter.filterRows; const filterTemplateMapper = [templateMapper].filter(row => !filterDialogView.includes(row)); console.log(filterTemplateMapper);
But it's not filtering 但它不是过滤
I am getting following output 我得到以下输出
[
{
"one": {
"title": "one"
},
"two": {
"title": "two"
},
"three": {
"title": "three"
}
}
]
Desire output 欲望输出
{
"two": {
"title": "two"
},
"three": {
"title": "three"
}
}
I want to filter row based on filterRows
for example if filterRows contain one
as above JSON then one
should be removed from the templateMapper
我想基于
filterRows
过滤行,例如,如果filterRows包含one
如上JSON,那么应该从templateMapper
删除one
You can use Object.fromEntries to build object back from filtered entries 您可以使用Object.fromEntries从过滤的条目中构建对象
Here idea is:- 这里的想法是: -
const filter = { filterRows: ['one'] }; const template = {'one': {title: 'one',},'two': {title: 'two',},'three': {title: 'three',}} const filterDialogView = filter.filterRows; const final = Object.entries(template).filter(([row])=> !filterDialogView.includes(row)) console.log(Object.fromEntries(final));
If you environment doesn't support Object.fromEntries you can use this 如果您的环境不支持Object.fromEntries,您可以使用它
const filter = { filterRows: ['one'] }; const template = {'one': {title: 'one',},'two': {title: 'two',},'three': {title: 'three',}} const filterDialogView = filter.filterRows; const final = Object.entries(template).filter(([row])=> !filterDialogView.includes(row)) const output = final.reduce((op,[key,value])=>{ op[key] = value return op },{}) console.log(output);
You could filter
the entries
of the object first. 您可以先
filter
对象的entries
。 Then use Object.fromEntries()
to create a new object from those filtered entries. 然后使用
Object.fromEntries()
从这些筛选的条目中创建一个新对象。
const filter = { filterRows: ['one'] }; const templateMapper = { 'one': { title: 'one', }, 'two': { title: 'two', }, 'three': { title: 'three', }, } const filteredObject = Object.fromEntries( Object.entries(templateMapper).filter(([k]) => !filter.filterRows.includes(k)) ) console.log(filteredObject)
One option is to create a copy of the templateMapper
object, then iterate through the filterRows
and delete each associated key: 一种选择是创建
templateMapper
对象的副本,然后遍历filterRows
并删除每个关联的键:
const filter = { filterRows: ['one'] }; const templateMapper = { 'one': { title: 'one', }, 'two': { title: 'two', }, 'three': { title: 'three', }, }; const filterTemplateMapper = { ...templateMapper }; filter.filterRows.forEach((key) => { delete filterTemplateMapper[key]; }); console.log(filterTemplateMapper);
(also, as comment notes, There's no such thing as a "JSON Object" ) (另外,作为评论说明, 没有“JSON对象”这样的东西 )
You can filter()
objects. 你可以
filter()
对象。 You should filter()
the entries of object and then convert it to object again using Object.fromEntries()
您应该
filter()
对象的条目,然后使用Object.fromEntries()
再次将其转换为对象
const filter = { filterRows: ['one'] }; const templateMapper = { 'one': { title: 'one', }, 'two': { title: 'two', }, 'three': { title: 'three', }, } const filterDialogView = filter.filterRows; const filterTemplateMapper = Object.fromEntries( Object.entries(templateMapper) .filter(row => !filterDialogView.includes(row[0].title)) ); console.log(filterTemplateMapper);
If Object.fromEntries()
is not supported by your browser then use reduce()
如果浏览器不支持
Object.fromEntries()
,请使用reduce()
const filter = { filterRows: ['one'] }; const templateMapper = { 'one': { title: 'one', }, 'two': { title: 'two', }, 'three': { title: 'three', }, } const filterDialogView = filter.filterRows; const filterTemplateMapper = Object.entries(templateMapper) .filter(row =>!filterDialogView.includes(row[0].title)) .reduce((ac,[k,v]) => (ac[k] = v,ac),{}); console.log(filterTemplateMapper);
You can use this way: 你可以这样使用:
const filter = { filterRows: ['one'] }; const templateMapper = { 'one': { title: 'one', }, 'two': { title: 'two', }, 'three': { title: 'three', }, } // Convert object templateMapper to array with key const keyArrayTemplateMapper = Object.keys(templateMapper); // Filter key array const filterKey = keyArrayTemplateMapper.filter(key => !filter.filterRows.includes(key)); // Using reduce method to return new array const output = filterKey.reduce((obj, key) => { obj[key] = templateMapper[key]; return obj; }, {}); console.log(output);
Instead of modifying the original object create a copy of it and delete the unwanted keys. 而不是修改原始对象创建它的副本并删除不需要的键。 For delete you can use
delete
keyword. 对于删除,您可以使用
delete
关键字。 Iterated the filterRows
array and then use delete
to remove the keys from the copied object 迭代
filterRows
数组,然后使用delete
从复制的对象中删除键
const filter = { filterRows: ['one'] }; const templateMapper = { 'one': { title: 'one', }, 'two': { title: 'two', }, 'three': { title: 'three' }, } let newObj = JSON.parse(JSON.stringify(templateMapper)); filter.filterRows.forEach(function(item) { if (newObj.hasOwnProperty(item)) { delete newObj[item] } }); console.log(newObj)
The filter()
function is only available on arrays. filter()
函数仅在数组上可用。 In order to get the same behaviour with an object, you need to use the object's entries()
. 为了获得与对象相同的行为,您需要使用对象的
entries()
。
const filter = { filterRows: ['one'] } const templateMapper = { 'one': { title: 'one', }, 'two': { title: 'two', }, 'three': { title: 'three', }, } const filteredMapper = Object.entries(templateMapper).reduce((acc, [key, value]) => { // if the key is not in the filtered list, add this entry to the object if (!filter.filterRows.includes(key)) { acc[key] = value } return acc }, {}) // pass in empty object as initial value of accumulator console.log(filteredMapper)
The way this works is we first get the entries
(key/value pairs) from templateMapper
. 这种方式的工作方式是我们首先从
templateMapper
获取entries
(键/值对)。 We then take those entries and reduce
them. 然后我们接受这些条目并
reduce
它们。 A reduce takes several arguments including an "accumulator" which is what collects the fields we want to keep. reduce有几个参数,包括一个“累加器”,它是收集我们想要保留的字段的东西。 We "destructure"
key
and value
so that we can check if the key is in the filter list. 我们“解构”
key
和value
以便我们可以检查键是否在过滤器列表中。 If it is not going to be filtered, we add it ot the accumulator. 如果它不会被过滤,我们将它添加到累加器中。 We then return the accumulator for the next iteration of the reduce.
然后我们返回累加器以进行reduce的下一次迭代。 Finally, we pass in an empty object as the initial value for the accumulator on the first iteration.
最后,我们在第一次迭代时传入一个空对象作为累加器的初始值。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.