按对象字段过滤数组并生成新数组：基于company字段过滤cards数组

没问题，这就帮你搞定这个数组过滤和字段提取的需求！针对你给出的data结构，我们可以分步骤实现筛选company为Symu.co的数据，并生成仅包含该字段的新数组。

方法一：提取所有符合条件的卡片并生成目标数组 #

首先我们需要把所有分散在不同lane里的cards合并成一个一维数组，再筛选出符合条件的卡片，最后提取需要的字段：

const data = {
  lanes: [
    {
      id: 'lane1',
      header: 'Quened',
      label: '',
      cards: [
        {id: 'Task1', title: 'Wordpress theme', company: 'Symu.co', price: 1500, user: 'michelle'},
      ]
    },
    {
      id: 'lane2',
      header: 'Planning',
      label: '',
      cards: [
        {id: 'Task2', title: 'Landing page', company: 'Google', price: 1500, user: 'jolene'},
        {id: 'Task3', title: 'New website', company: 'Symu.co', price: 1500, user: 'lyall'}
      ]
    }
  ]
};

// 1. 扁平化所有cards数组 + 筛选company为Symu.co的卡片
const filteredCards = data.lanes.flatMap(lane => lane.cards).filter(card => card.company === 'Symu.co');

// 2. 生成仅包含company字段值的数组（纯字符串数组）
const companyValueArray = filteredCards.map(card => card.company);
console.log(companyValueArray); // 输出: ['Symu.co', 'Symu.co']

// 或者生成仅包含company字段的对象数组
const companyObjectArray = filteredCards.map(card => ({ company: card.company }));
console.log(companyObjectArray); // 输出: [{company: 'Symu.co'}, {company: 'Symu.co'}]

代码解释 #

• flatMap(lane => lane.cards)：把每个lane里的cards数组合并成一个一维数组，避免嵌套遍历的麻烦。
• filter(card => card.company === 'Symu.co')：精准筛选出company字段匹配目标值的卡片对象。
• map方法：根据你的需求生成两种不同形式的数组——纯字段值数组，或者只保留目标字段的对象数组。

方法二：保留原有的lane层级结构 #

如果你需要保留原有的lane层级，只过滤每个lane内符合条件的cards，可以用下面的写法：

const lanesWithFilteredCards = data.lanes
  .map(lane => ({
    ...lane, // 复制lane的原有属性
    cards: lane.cards.filter(card => card.company === 'Symu.co') // 替换为过滤后的cards
  }))
  .filter(lane => lane.cards.length > 0); // 可选：移除没有符合条件卡片的lane

console.log(lanesWithFilteredCards);

这个方法会保留lane的其他属性（比如id、header），只更新cards为筛选后的结果，最后还可以过滤掉没有有效卡片的lane。

内容的提问来源于stack exchange，提问作者Вова Магдич