如何在javascript中将对象数组过滤为另一个对象数组？ [关闭]

Posted 2023-03-07

【中文标题】如何在javascript中将对象数组过滤为另一个对象数组？ [关闭]

【英文标题】：How to filtering array of objects to another array of objects in javascript? [closed]

【发布时间】：2020-07-04 20:30:28

【问题描述】：

我有两个对象数组。我想根据 PermissionObj 过滤数据。

这是来自数据库。这是 permissionObj 中的子数组数组。

    const PermissionObj = 
     permission: [
       "books": [
        "label": "Can View",
        "value": "can_view"
       ]
      ,
      
       "Journals": [
         "label": "Can View",
         "value": "can_view"
        ,
        
         "label": "Can Create",
         "value": "can_create"
        ,
       ]
      ,
      
       "deal": [
         "label": "Can update",
         "value": "can_update"
        ,
        
         "label": "Can delete",
         "value": "can_delete"
        ,
       ]
      
     ]
    

这是静态数据。我想根据 PermissionObj 比较这个数据。

const data = [
  label: "books",
  value: "can_view"
 ,
 
  label: "deal",
  content: [

   value: "can_update"
  , 
   value: "can_delete"
  ,value:"can_view"]
 ,
 
  label: "Articles",

 ,
 
  label: "Journals",
  content: [
    value: "can_create"
   ,
   
    value: "can_view"
   ,
  
    value: "can_delete"
   ,
 
    value: "can_edit"
   ,

  ]
 
]

我正在尝试根据 PermissionObj 对象数组 过滤 对象数据数组。这是我尝试的代码。

let permission = PermissionObj.permission 

permission.filter(item=>
  // I am finding data label by using permission label.

 let dataItem = data.find(index=>item[index.label])

 console.log(dataItem)

)

  // the problem is that I want to filtering based on value .

  // if both of value is true , then show the data . 

如果 PermissionObj 值将与数据值匹配。然后显示数据。 我接受的输出将是这种格式：

const data = [
  label: "books",
  value: "can_view"
 ,
 
  label: "deal",
  content: [
   value: "can_update"
  , 
   value: "can_delete"
  ]
 ,
 
  label: "Journals",
  content: [
    value: "can_create"
   ,
   
    value: "can_view"
   ,


  ]
 
]

【问题讨论】：

我看到输出未定义

filter 返回一个数组，所以你需要将它分配给一个变量let filtered = permission.filter...

你看这个。我真的很麻烦这个问题

【参考方案1】：

来自 PermissionObj 的第一个构建 keys。对标签包含在keys 中的数据数组使用过滤器。

const PermissionObj = 
  permission: [
    
      books: [
        
          label: "Can View",
          value: "can_view"
        
      ]
    ,
    
      Journals: [
        
          label: "Can View",
          value: "can_view"
        ,
        
          label: "Can Create",
          value: "can_create"
        
      ]
    ,
    
      deal: [
        
          label: "Can update",
          value: "can_update"
        ,
        
          label: "Can delete",
          value: "can_delete"
        
      ]
    
  ]
;

const data = [
  
    label: "books",
    value: "can_view"
  ,
  
    label: "deal",
    content: [
      
        value: "can_update"
      ,
      
        value: "can_delete"
      
    ]
  ,
  
    label: "Articles"
  ,
  
    label: "Journals",
    content: [
      
        value: "can_create"
      ,
      
        value: "can_view"
      
    ]
  
];

const perm = ;
PermissionObj.permission.forEach(item =>
  Object.entries(item).forEach(([key, values]) => 
    perm[key] = values.map(x => x.value);
  )
);

const updated = data
  .map(item => 
    const newItem = 
      ...item
    ;
    if (item.content) 
      newItem.content = item.content.filter(x =>
        perm[item.label].includes(x.value)
      );
     else if (item.value) 
      newItem.value = perm[item.label].includes(item.value) ? item.value : "";
    
    return newItem;
  )
  .filter(x => x.content || x.value);

console.log(updated);

【讨论】：

如果我的数据添加额外的两个值会出现一些问题 例如： label: "Journals", content: [ value: "can_create" , value: "can_view" , value : "can_edit" , value: "can_delete" ] ，但我不想看到 can_delete 和 can_edit 因为权限不携带 can_delete, can_edit 在 journals 中。我想用数据来比较permissionobj。

我更新了我的代码。你能再看看吗

@sujon，哦，知道了，我刚刚更新了答案。希望对您有所帮助。

如果我基于此对象进行过滤，我会遇到问题 const PermissionObj = permission: [ books: [ label: "Can View", value: "can_view" ] ] ;我可以看到有一个未定义的包含

我刚刚使用 && 运算符 perm[item.label] && perm[item.label].includes(x.value) 解决了这个问题。但是，如果我根据这种格式进行过滤，我将面临另一个问题 const PermissionObj = permission: [ books: [ label: "Can View", value: "can_view" ] ] ;我只想在数据 [label:"books",value:"can_view"] 中查看这个对象数组。但是，我可以看到这种格式 [label:"books",value:"can_view", label:"deal",content:[], label:"Journals", content: []]跨度>

【参考方案2】：

所以您可以获得permission 数组的keys，这将为您提供一个键数组。因为您正在获取对象数组中某个项目的keys，因此key 将始终是第一项，然后您可以使用该键检查每个数据项

const PermissionObj = 
    permission: [
      
        books: [
          
            label: "Can View",
            value: "can_view"
          
        ]
      ,
      
        Journals: [
          
            label: "Can View",
            value: "can_view"
          ,
          
            label: "Can Create",
            value: "can_create"
          
        ]
      ,
      
        deal: [
          
            label: "Can update",
            value: "can_update"
          ,
          
            label: "Can delete",
            value: "can_delete"
          
        ]
      
    ]
  ;

  const data = [
    
      label: "books",
      value: "can_view"
    ,
    
      label: "deal",
      content: [
        
          value: "can_update"
        ,
        
          value: "can_delete"
        
      ]
    ,
    
      label: "Articles"
    ,
    
      label: "Journals",
      content: [
        
          value: "can_create"
        ,
        
          value: "can_view"
        
      ]
    
  ];
  
    let permission = PermissionObj.permission;
    let NewData = [];
    permission.filter(item => 
      let ObjectKeys = Object.keys(item);
      let ObjKey = ObjectKeys[0];
      let DATA = data.find(
        dataItem => dataItem.label.toString() === ObjKey.toString()
      );
      NewData.push(DATA);
    );
    console.log(NewData);

【讨论】：

如果我的数据添加额外的两个值会出现一些问题 例如： label: "Journals", content: [ value: "can_create" , value: "can_view" , value : "can_edit" , value: "can_delete" ] ，但我不想看到 can_delete 和 can_edit 因为权限不带有 can_delete, can_edit 。

我更新了我的代码。你能再看看吗

你能看看这个***.com/questions/61106551/…