Javascript 如何用一行代码过滤和修改对象数组？

我的数据库中有以下对象数组：

dataFromDB = [
  { src: 'stringWithSource1',
    selected: true
  },
  { src: 'stringWithSource2',
    selected: false
  },
  { src: 'stringWithSource3',
    selected: true
  },
  AND SO ON...
];

当我从数据库中获取它时，我需要在客户端以

状态存储
，必须是一个字符串数组，只包含
所选对象的
src
属性：true

示例：

myState = [
  'stringWithSource1',
  'stringWithSource3',
  AND SO ON...
]

问题

我分配此项的行如下所示（请参见下面的代码）：

我试过了，但没有成功，因为我将未选中的
src
保留为
null
，而不是跳过它们

setProductDetails({
  // ... other properties,
  images: dataFromDB.images.map((item) => {
    return item.selected ? item.src : null;
  }
});

我如何在这样一行中实现这种行为？我知道我可以创建一个辅助变量并处理它。但我想在这种情况下，一个班轮。这可能吗？感觉我应该同时过滤和映射？
您需要两个部分，因为过滤不映射值，而是映射原始项

您可以通过选择
进行过滤，然后映射
src

images: dataFromDB.images
    .filter(({ selected }) => selected)
    .map(({ src }) => src)

您需要两个部分，因为筛选不映射值，而是映射原始项

您可以通过选择
进行过滤，然后映射
src

images: dataFromDB.images
    .filter(({ selected }) => selected)
    .map(({ src }) => src)

“在一行中”-为什么？请尽可能详细地说明，让您或任何正在阅读代码的人立即了解此处发生的情况。因为我是在
setState（）
中执行此操作的。谢谢“在一行中”-为什么？请尽可能详细地说明，让您或任何正在阅读代码的人立即了解此处发生的情况。因为我是在
setState（）
中执行此操作的。谢谢