Javascript 错误：“已收到'children'属性的NaN。如果需要，请将该值转换为字符串。”

当我试图显示数组字典数组中的数据时，标题中出现了错误。 这仅适用于change5day阵列。其他数组正在我的JSX中复制它们的值。下面我将展示如何实现工作示例和非工作示例

beta: Array(8) //This object works fine!
0: {symbol: "AAL", beta: 1.5533897423778862}
1: {symbol: "AAPL", beta: 1.2504351069178914}
2: {symbol: "AMD", beta: 1.2406108515690375}
3: {symbol: "FB", beta: 1.1853145746084135}
4: {symbol: "LUV", beta: 1.3727521874575148}
5: {symbol: "MSFT", beta: 1.1366312839677446}
6: {symbol: "NVDA", beta: 1.4118377903501154}
7: {symbol: "TSLA", beta: 1.9493936257640456}


change5day: Array(8) //This object is showing NaN's
0: {symbol: "AAL", day5avg: -0.013411567476948827}
1: {symbol: "AAPL", day5avg: 0.08126016260162605}
2: {symbol: "AMD", day5avg: 0.020594401282525654}
3: {symbol: "FB", day5avg: 0.04620638853545822}
4: {symbol: "LUV", day5avg: 0.034584013050571016}
5: {symbol: "MSFT", day5avg: 0.05570455952135345}
6: {symbol: "NVDA", day5avg: 0.0425905479030535}
7: {symbol: "TSLA", day5avg: 0.02307517944843207}

这是我的密码：

<Tooltip title="Average 5-day volatility Vs. SP500">
    <Typography variant="overline" component="span" color="textPrimary">
        {calculateAvgValue(object.beta) < 1 && "... " + ((calculateAvgValue(object.beta) - 1) * 100).toFixed(2) +"%"}
    </Typography>
</Tooltip>  
</Grid>
<Grid item xs={displayExtraData.view} sm={displayExtraData.view} md={12}> 
    <Typography variant="overline" component="span" color="textSecondary">                                          
        Return
    </Typography>
<Tooltip title="Average 5-day Return ">
    <Typography variant="overline" component="span" color="textPrimary">
        {calculateAvgValue(object.change5day) && "%" + 
((calculateAvgValue(object.change5day) -1) * 100).toFixed(2)}
// This code is reproducing the error in title. I cannot get the value from my function to print
    </Typography>
</Tooltip>

如何从change5day获取要显示的数据？

calculateAvgValue函数通过beta属性对数组元素求和。由于object.change5day数组中的元素没有beta属性，因此reducer中的b.beta未定义，导致NaN返回0+undefined->NaN，NaN+undefined->NaN

更新calculateAvgValue函数以接收用于对数组求和的键

export function calculateAvgValue(array, key = 'beta') {
  const sum = array.reduce((a, b) => a + b[key], 0)
  return sum / array.length
}

现在可以调用传递数组和day5avg键的函数

calculateAvgValue在序列数组中的每个成员对象上查找属性beta。change5day数组成员没有beta属性，它们有day5avg属性。当calculateAvgValue尝试在没有beta属性的对象上访问b.beta时，它将未定义。0+未定义返回NaN。

export function calculateAvgValue(array, key = 'beta') {
  const sum = array.reduce((a, b) => a + b[key], 0)
  return sum / array.length
}

calculateAvgValue(object.change5day, 'day5avg')