Javascript 按嵌套值筛选对象数组

我正在尝试过滤这个对象数组，并保留原始数组

{"departments":
 [
  {
    “name": “AAA",
    “selected”: true,            
    "courses": [
        {
            "name": “course1",
            “selected”: true,
            “titles”: 
            [{
              "name": “title1",
              “selected”: true
             },
             {
             "name": “title2",
             “selected”: false
            }]
         },
         {
            "name": “course2",
            “selected”: false,
            “titles”: 
            [{
              "name": “title1",
              “selected”: false
             }]   
          }
    ]
 },
 {
    “name": “BBB",
    “selected”: false,
    "courses": [{...}]

 {...}    
 ]
}

我想找到所有选定的系、课程和职称。而且应该是相同的格式。 我尝试了下面的代码，但它改变了原始数据。我也想把它放在一边

const depts = departments.filter((dept: any) => {
    if (dept.selected) {
      dept.courses = dept.courses.filter((course: any) => {
        if (course.selected) {
          if (course.titles) {
            course.titles = course.titles.filter(({selected}: any) => selected);
          }
          return true;
        }
        return false;
      });
      return true;
    }
    return false;
  });

在这种情况下，什么是最佳解决方案？

const filterSelected=obj=>{
返回{
…obj，
部门：obj.departments.map（dep=>{
返回{
…副，
课程：dep.courses.map（课程=>{
返回{
课程
标题：course.titles.filter（title=>title.selected），
};
}).filter（课程=>course.selected），
};
}).filter（dep=>dep.selected），
};
}
常数全部={
部门：[
{
名称：“AAA”，
选择：正确，
课程：[
{
名称：“课程1”，
选择：正确，
标题：[
{
名称：“标题1”，
所选：真
}, {
名称：“标题1”，
所选：false
}
]
}, {
名称：“课程2”，
选择：false，
标题：[
{
名称：“标题1”，
所选：false
}
]
},
]
}
]
};
console.log（filterSelected（all））
const filterSelected=obj=>{
返回{
…obj，
部门：obj.departments.map（dep=>{
返回{
…副，
课程：dep.courses.map（课程=>{
返回{
课程
标题：course.titles.filter（title=>title.selected），
};
}).filter（课程=>course.selected），
};
}).filter（dep=>dep.selected），
};
}
常数全部={
部门：[
{
名称：“AAA”，
选择：正确，
课程：[
{
名称：“课程1”，
选择：正确，
标题：[
{
名称：“标题1”，
所选：真
}, {
名称：“标题1”，
所选：false
}
]
}, {
名称：“课程2”，
选择：false，
标题：[
{
名称：“标题1”，
所选：false
}
]
},
]
}
]
};
console.log（filterSelected（all））您的筛选逻辑似乎是正确的。唯一的问题是代码更改了原始数组。为了克服这个问题，只需创建原始阵列的深层克隆并在其上运行过滤逻辑

filterary（）{
const clone=JSON.parse（JSON.stringify（this.departments））；
const depts=clone.filter（（dept:any）=>{
如果（所选部门）{
dept.courses=dept.courses.filter（（课程：任意）=>{
如果（所选课程）{
if（课程名称）{
course.titles=course.titles.filter（（{selected}:any）=>selected）；
}
返回true；
}
返回false；
});
返回true；
}
返回false；
});
控制台日志（部门）；
}

这是一个演示
您的过滤逻辑似乎是正确的。唯一的问题是代码更改了原始数组。为了克服这个问题，只需创建原始阵列的深层克隆并在其上运行过滤逻辑

filterary（）{
const clone=JSON.parse（JSON.stringify（this.departments））；
const depts=clone.filter（（dept:any）=>{
如果（所选部门）{
dept.courses=dept.courses.filter（（课程：任意）=>{
如果（所选课程）{
if（课程名称）{
course.titles=course.titles.filter（（{selected}:any）=>selected）；
}
返回true；
}
返回false；
});
返回true；
}
返回false；
});
控制台日志（部门）；
}

下面是一个演示
可以使用以下选项的较短备选方案：


var arr=[{name:“AAA”，selected:true，courses:[{name:“course1”，selected:true，titles:[{name:“title1”，selected:false}，{name:“course2”，selected:false，titles:[{name:“title1”，selected:false}]}]
var result=JSON.parse（JSON.stringify（arr），（k，v）=>v.map？v.filter（x=>x.selected）：v）
console.log（结果）
较短的替代方法可以是使用：


var arr=[{name:“AAA”，selected:true，courses:[{name:“course1”，selected:true，titles:[{name:“title1”，selected:false}，{name:“course2”，selected:false，titles:[{name:“title1”，selected:false}]}]
var result=JSON.parse（JSON.stringify（arr），（k，v）=>v.map？v.filter（x=>x.selected）：v）
console.log（result）
我不知道您是否喜欢API false。以下是我的建议：

您可以选择使用API Json服务器

安装JSON服务器

npm install -g json-server

json-server --watch db.json

创建一个包含一些数据的db.json文件

{
  "posts": [
    { "id": 1, "title": "json-server", "author": "typicode" }
  ],
  "comments": [
    { "id": 1, "body": "some comment", "postId": 1 }
  ],
  "profile": { "name": "typicode" }
}

启动JSON服务器

npm install -g json-server

json-server --watch db.json

现在如果您转到
http://localhost:3000/posts/1
，您将获得

{ "id": 1, "title": "json-server", "author": "typicode" }

您可以使用各种形状搜索您的对象数组，它将被过滤。有关API的更多信息，请参见：

（使用过滤器在Angular上进行搜索，它将为您提供正确的所需内容，在组件内部使用方法）
我不知道您是否喜欢API false。以下是我的建议：

您可以选择使用API Json服务器

安装JSON服务器

npm install -g json-server

json-server --watch db.json

创建一个包含一些数据的db.json文件

{
  "posts": [
    { "id": 1, "title": "json-server", "author": "typicode" }
  ],
  "comments": [
    { "id": 1, "body": "some comment", "postId": 1 }
  ],
  "profile": { "name": "typicode" }
}

启动JSON服务器

npm install -g json-server

json-server --watch db.json

现在如果您转到
http://localhost:3000/posts/1
，您将获得

{ "id": 1, "title": "json-server", "author": "typicode" }

您可以使用各种形状搜索您的对象数组，它将被过滤。有关API的更多信息，请参见：

（使用过滤器在角度上进行搜索，它将为您提供正确的所需内容，在组件内部使用方法）