前端操作数据-处理后端数据整理

当后端返回的数据不是我们需要的格式或者字段名不匹配的情况下，后端又不方便修改，前端该怎么来处理呢，下面我列出了几种情况：

一.数组对象不匹配

后端返回数据格式：

data: [
  {
   
    id: '003268955',
    name: 'tom',
    age: 18
  },
  {
   
    id: '0335689754',
    name: 'mark',
    age: 23
  }
];

• 假设：

1. 这里的id返回的类型是string，而你需要的是number类型

data = data.map(res => {
   
    return {
   
        ...res,
        id: Number(res.id)
    }
})
//输出=>
[
  {
    id: 3268955, name: 'tom', age: 18 },
  {
    id: 335689754, name: 'mark', age: 23 }
];

2.后端返回的是name字段名，而你需要的是username(这里我们直接复制出一个新的key就行，旧的key值可以保留也可删除)

//不删除旧key
data = data.map(res => {
   
    return {
   
        ...res,
        username: res.name
    }
})
//输出=>
[
  {
    id: '003268955', name: 'tom', age: 18, username: 'tom' }