JS:按索引在对象数组中切片嵌套数组

时间:2020-04-01 16:27:12

标签: javascript arrays

任务是通过data属性对嵌套数组进行切片。 我具有以下数组结构:

  const mockData = [
    {
      text: 'Text1',
      data: [
        { field: '1' },
        { field: '2' },
        { field: '3' },
        { field: '4' },
        { field: '5' },
        { field: '6' }
      ]
    },
    {
      text: 'Text2',
      data: [{ field: '1' }, { field: '2' }, { field: '3' }, { field: '4' }]
    }
  ];

这是我使用的方法:

const sliceArray = mockData => mockData.map(d => ({...d, data: d.data.slice(0, 3)}))

它通过data属性遍历所有嵌套对象和切片数组,但是如何针对特定的嵌套对象而不是所有嵌套对象呢? 我想使用text属性作为键。

因此,如果我将Text1传递给方法-仅将第一个对象中的data属性进行切片,输出应为:

 const mockData = [
    {
      text: 'Text1',
      data: [{ field: '1' }, { field: '2' }, { field: '3' }]
    },
    {
      text: 'Text2',
      data: [{ field: '1' }, { field: '2' }, { field: '3' }, { field: '4' }]
    }
  ];

如果我传递“ Text2”:

 const mockData = [
    {
      text: 'Text1',
       data: [
        { field: '1' },
        { field: '2' },
        { field: '3' },
        { field: '4' },
        { field: '5' },
        { field: '6' }
      ]
    },
    {
      text: 'Text2',
      data: [{ field: '1' }, { field: '2' }, { field: '3' }]
    }
  ];

有什么解决方案?谢谢!

3 个答案:

答案 0 :(得分:3)

您可以尝试添加如下条件:

const sliceArray = (mockData, text) => 
                     mockData.map(d => d.text === text 
                        ? {...d, data: d.data.slice(0, 3)} 
                        : d)

答案 1 :(得分:2)

您只需在函数中添加另一个参数,然后检查文本是否与该参数匹配。

 const mockData = [{"text":"Text1","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"},{"field":"5"},{"field":"6"}]},{"text":"Text2","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"}]}]

const sliceArray = (data, target, len = 3) => 
  data.map(({ text, data, ...rest}) => ({
    data: text == target ? data.slice(0, len) : data,
    text,
    ...rest
  }))

console.log(sliceArray(mockData, 'Text1'))

您还可以传递要匹配的文本值数组,并使用includes方法进行检查。

 const mockData = [{"text":"Text1","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"},{"field":"5"},{"field":"6"}]},{"text":"Text2","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"}]}, {"text":"Text3","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"},{"field":"5"},{"field":"6"}]}]

const sliceArray = (data, targets, len = 3) => 
  data.map(({ text, data, ...rest}) => ({
    data: targets.includes(text) ? data.slice(0, len) : data,
    text,
    ...rest
  }))

console.log(sliceArray(mockData, ['Text1', 'Text3']))

答案 2 :(得分:1)

如果您不想修改现有数据,因为您是在嘲笑。使用reduce

const mockData = [
  {
    text: "Text1",
    data: [
      { field: "1" },
      { field: "2" },
      { field: "3" },
      { field: "4" },
      { field: "5" },
      { field: "6" }
    ]
  },
  {
    text: "Text2",
    data: [{ field: "1" }, { field: "2" }, { field: "3" }, { field: "4" }]
  }
];

function update(data, text, count = 3) {
  return data.reduce((arr, item) => {
    let updatedItem = { ...item };
    if (item.text === text) {
      updatedItem.data = (updatedItem.data || []).slice(0, count);
    }
    arr.push(updatedItem);
    return arr;
  }, []);
}

console.log("%j", update(mockData, "Text1"));
.as-console-row {color: blue!important}