数据处理：使用‘map加if判断’的注意事项

1.数据处理：map的使用
需求：拆分data为两个数据：columns和数据columns2，最终columns和columns2用于表格展示，因此还要将两个数据整理成表格需要的格式，使用的是antd表格

data:

其中import_factor_top_k为对象

columns:

columns2：里面就是import_factor_top_k

Object.keys(this.resultData).map(data =>{
    if(typeof this.resultData[data] !== 'object'){
        columns.push({
            title: data,
            dataIndex: data,
            key: data
        })
    } else {
        Object.keys(this.resultData[data]).map(item =>
            columns2.push({
                title: item,
                dataIndex: item,
                key: item
            })
        )
    }
})

注意：使用map时的花括号位置
1.返回一个对象需要加return，return前需要花括号
arr.map(data=>{return

{
    title: data,
    dataIndex: data,
    key: data
}

)

花括号太多，优化：(return和他前面的花括号变为括号)
arr.map(data=>

({
    title: data,
    dataIndex: data,
    key: data
})

)

2.return花括号情况下，加if判断后，还需要加花括号
arr.map(data=> if(data!=='object') {return

{
    title: data,
    dataIndex: data,
    key: data
}

)报错

arr.map(data=> {if(data!=='object') {return

{
    title: data,
    dataIndex: data,
    key: data
}}

)正确

2.另一种思路：将data处理成length为2的数组，第一项存放表格的第一行（表头），第二项存放表格的第二行，用原生<table><tr><td>渲染
data:

 handler: (data) => {
  let _keys = []
  let _values = []
  let values = []
  let keys = []
  Object.keys(data).map(key => {
    if (key === 'import_factor_top_k') {
      Object.keys(data['import_factor_top_k']).map(_key => {
        _values.push(data['import_factor_top_k'][_key])
        _keys.push(_key)
      })
    } else {
      values.push(data[key])
      keys.push(key)
    }
  })
  return [{
    title: '预测准确度指标',
    dataSource: [['预测性能指标', ...keys], ['数值', ...values]]
  }, {
    title: '所取特征及对应的权重',
    dataSource: [['特征名称', ..._keys], ['权重', ..._values]]
  }]
}