Javascript 计算流数据集的时差

我有以下函数，它根据来自另一个组件的流信号器数据呈现一行：

let prev
let next

renderRow = () = {
    this.props.incomingData.map(item => {
        return (
            <tr>
                <td>{item.time}</td> //00:00:00 format
                <td>{this.calculateSecondsTaken()}</td> //should show the time difference in seconds
                <td>{item.event}</td>
                <td>{item.message} <br/>{item.outputURL}</td>
            </tr>
        )
    })
}

我知道在上面的函数中，它必须是基于上一个和下一个时间值的某种减法，但我不能完全确定它的逻辑。例如，第一排的区别是什么

编辑： 数据流组件如下所示

deploymentEventMessageReceived = (item: DeploymentEvent) => {
    let dataset = {
        time: item.UtcNowPrettyText, //this is the time value
        event: item.EventName,
        message: item.Message,
        outputURL: item.OutputUrl
    }
    let newDataArray = this.state.receivedData.concat(dataset);

    this.setState({
        receivedData: newDataArray
    });
}

deploymentEventMessageReceived（）

依次在我连接到Signal的函数中被调用

编辑2更新（工作版本）：

数据流组件的内部render（）

<RenderRow receivedData={this.state.receivedData} />

---

非常感谢您的帮助。

我将以这种方式实现时差计算：我跟踪

Date.now（）

，我不渲染它，而是将其保存在每个条目中，以便对其执行数学运算。我不知道您打算如何渲染时差，但在我的示例中，我将它放在

this.state

中

deploymentEventMessageReceived = (item) => {
    let dataset = {
        time: item.UtcNowPrettyText, //this is the time value
        event: item.EventName,
        message: item.Message,
        outputURL: item.OutputUrl,
        date: Date.now()
    }
    let lastEntry = this.state.receivedData[this.state.receivedData.length - 1]
    let timeDifference = dataset.date - lastEntry.date //time in ms
    let newDataArray = this.state.receivedData.concat(dataset);

    this.setState({
        receivedData: newDataArray,
        timeDifference: timeDifference
    });
}

编辑：我个人的实现是将这两个概念分开。我保留

Date.now（）

，并创建一个不同的函数来实际构建时差数组。永远不知道以后是否需要

Date.now（）

，在数据中完整地添加时间戳才更有意义。您不需要立即添加

项。你可以稍后再看。我使用对象分解将赋值清理为两行一行

deploymentEventMessageReceived = (item) => {
  let { UtcNowPrettyText, EventName, Message, OutputUrl } = item
  let dataset = { UtcNowPrettyText, EventName, Message, OutputUrl, Date: Date.now() }
  this.setState({receivedData: this.state.receivedData.concat(dataset)})
}

buildTimeDifferences = (entries) => {
  let newArr = []
  for (let i = 0; i < entries.length; i++) {
    if (i !== entries.length - 1) {
      newArr.push(entries[i + 1].Date - entries[i].Date)
    }
  }
  return newArr
}


d = [{Date: 1},{ Date: 2}, {Date: 4}, {Date: 7}]
console.log(buildTimeDifferences(d))

deploymentEventMessageReceived=（项目）=>{
让{UtcNowPrettyText，EventName，Message，OutputUrl}=item
让dataset={UtcNowPrettyText，EventName，Message，OutputUrl，Date:Date.now（）}
this.setState（{receivedData:this.state.receivedData.concat（数据集）}）
}
buildTimeDifferences=（条目）=>{
让newArr=[]
for（设i=0；i
请您详细说明一下好吗？抱歉，我的问题不好。那么，您是说要从
this.props.incomingData
中获取数组上的最后一个元素，并从您将要接收的新条目的时间中减去它？是的，没错。
renderRow
的父组件中是否有
calculateSecondsTaken
？您的数据流功能是什么样子的？如何将其添加到最终传递给
renderRow
的数组中？我已经用更多信息更新了原始帖子。
让lastEntry=this.state.receivedData[this.state.receivedData.length-1]
让timeDifference=Date.now（）-lastEntry.Date//time in ms

看不出这是如何工作的，因为

这个.state.receivedData

一开始是一个空数组。@zeroderkthirty我觉得你会问这个问题。如果您认为我的逻辑适合您的需要，我相信您可以让代码使用一个或两个条件；）。我听到了！现在，您能解释一下为什么将Date.Now（）放在数据集中吗？@ZeroDarkThirty这是一个毫无意义的原因。肯定应该是

dataset.date

。将立即更新。我已修改了您的解决方案并使其正常工作，但当我更新状态时，所有以前的时差值都将更新为最新的值。我需要一种方法让它保持以前的值。有什么想法吗？

deploymentEventMessageReceived = (item) => {
    let dataset = {
        time: item.UtcNowPrettyText, //this is the time value
        event: item.EventName,
        message: item.Message,
        outputURL: item.OutputUrl,
        date: Date.now()
    }
    let lastEntry = this.state.receivedData[this.state.receivedData.length - 1]
    let timeDifference = dataset.date - lastEntry.date //time in ms
    let newDataArray = this.state.receivedData.concat(dataset);

    this.setState({
        receivedData: newDataArray,
        timeDifference: timeDifference
    });
}

deploymentEventMessageReceived = (item) => {
  let { UtcNowPrettyText, EventName, Message, OutputUrl } = item
  let dataset = { UtcNowPrettyText, EventName, Message, OutputUrl, Date: Date.now() }
  this.setState({receivedData: this.state.receivedData.concat(dataset)})
}

buildTimeDifferences = (entries) => {
  let newArr = []
  for (let i = 0; i < entries.length; i++) {
    if (i !== entries.length - 1) {
      newArr.push(entries[i + 1].Date - entries[i].Date)
    }
  }
  return newArr
}


d = [{Date: 1},{ Date: 2}, {Date: 4}, {Date: 7}]
console.log(buildTimeDifferences(d))