添加或推送第 10 个索引号到数组

Question

我正在制作一个图表，我需要将我的数据分割成小对象，以便更好地查看。我的数组是

   {
      "size":[
        {
          "timestamp":"1641329889000",
          "size":12345,
          "fees":123456,
          "cost":168
        },
        {
          "timestamp":"1641387032",
          "size":456789,
          "fees":4567891,
          "cost":249
        },
        {
          "timestamp":"1641435786",
          "size":98765,
          "fees":987654,
          "cost":987
        },
        {
          "timestamp":"1641435786",
          "size":98765,
          "fees":987654,
          "cost":987
        },
        {
          "timestamp":"1641435786",
          "size":98765,
          "fees":987654,
          "cost":987
        }
      ]
    }

其中我希望数组采用这种形式

{
  "size":{
    "timestamp": ["1641329889000","1641387032","1641435786"],
    "size": [12345,456789,98765],
    "fees": [123456,4567891,987654],
    "cost": [168,249,987]
  }
}

我可以像这样使用 foreach 和 push 来实现这个

 result.forEach(element => {
     this.state.timestamp.push(element.timestamp);
     this.state.size.push(element.size);
  });

但我希望这个数组仅包含第 10、20、30、40 个索引中的项目我不想要所有的价值。这些值应该只在 x+10 的基础上选择谁能帮我解决这个问题

Answer 1

而不是 forEach 为什么不使用 for 循环，并在条件下使用模数 % 运算符和 10？就像 for 循环中的 if (i % 10 == 0) 一样，或者像 i+=10.

一样将 i 增加 10

Answer 2

如@cybercoder 所述，您可能不想更改 forEach 中的 state 变量，因为这会导致 render 被过度调用。

您可以简单地使用一个计数器，并且只在索引可以被 10 整除时压入元素：

 let i = 0;
 let {timestamp, size} = this.state;

 result.forEach(element => {
     if (i % 10 === 0) {
         timestamp.push(element.timestamp);
         size.push(element.size);
     }
     i++;
  });

  this.setState({
    ...this.state,
    timestamp,
    size
  });

如果您不想包含第一个（索引 0）元素：

 let i = 0;
 let {timestamp, size} = this.state;

 result.forEach(element => {
     // Exclude very first element
     if (i % 10 === 0 && i !== 0) {
         timestamp.push(element.timestamp);
         size.push(element.size);
     }
     i++;
  });

  this.setState({
    ...this.state,
    timestamp,
    size
  });

Answer 3

您可以采用 for 循环和递增索引的步骤。

const
    step = 10,
    keys = ["timestamp", "size", "fees", "cost"],
    result = Object.fromEntries(keys.map(k => [k, []]));

for (let i = 0; i < size.lenght; i += step) {
    keys.forEach(key => result[key].push(size[i][key]));
}

Answer 4

使用forEach是一种资源浪费。您可以使用 for 代替：

for(let i=0;i<result.length;i+10){
   this.state.timestamp.push(result[i].timestamp);
   this.state.size.push(result[i].size);
}

要设置状态，您应该使用 setState 而不是直接按下它。

    let tmp = {
      ...this.state
    }
    for(let i=0;i<result.length;i+10){
       tmp.size.timestamp.push(result[i].timestamp);
       tmp.size.push(result[i].size);
    }
    this.setState(tmp)

添加或推送第 10 个索引号到数组

add or push a 10th index number to the array

javascript

arrays

foreach

splice

reactjs